where to put the functions in angularjs, service or directive - angularjs

Question

I have a grid directive and related service. The code like below:
(function (window, angular) {
'use strict';
angular.module("myModule")
.service("myGrid", [
function () {
var self = this;
this.init_grid = function (scope, config) {
scope.itemsList = []; // particular grid data
};
this.methodsList = {
add: function () {
// add logic...
},
edit: function (scope, evt, data) {
}
};
}
])
.directive("myGridView", ["$compile", "myGrid", function ($compile, myGrid) {
return {
restrict: "E",
replace: true,
transclusion: true,
templateUrl: "views/gridTemplate.html",
scope: {
config: "="
},
link: function ($scope, iElement, iAttrs, controller) {
myGrid.init_grid(scope, scope.config);
// register method in scope
angular.forEach(myGrid.methodsList, function (method, k) {
scope[k] = method;
//scope[k] = function() {method($scope)}
});
}
};
}
])
;
})(window, window.angular);
<form>
<my-grid-view config="config1"></my-grid-view>
<my-grid-view config="config2"></my-grid-view>
<my-grid-view config="config3"></my-grid-view>
</form>
My question is that:
As the form contains more than one grid, and they call the same functions in service, how can the add or edit functions know which grid calling and how to dealer with the particular data in grid?
Currently,
(1)I pass the scope to the add or edit function to implement//scope[k] = function() {method($scope)},
(2)Another way, in link function, define $scope.add = function() {}
(3)I can also define a controller in directive and defines these function.
What is the best practice to implement this purpose?