javascript - Passing a controller to a directive in angularJS. Gives undefined error -
i working add modals directives using ui-bootstrap , did fine on previous directive. don't believe doing differently in 1 referenceerror: milestonecontroller not defined when run edit() function within directive.
milestone.html (this template html directive below):
<div ng-controller = "milestonecontroller"></div>
milestone directive:
angular.module('ireg').directive('milestone', function (milestonefactory,$modal) { return { restrict:'e', scope: { objectid:'@objectid' }, templateurl: '/ireg/components/milestone/milestone.html', link: function ($scope, element, attrs) { $scope.edit = function(data) { milestonecontroller.editmilestonedialog(data); }; } } }); angular.module('ireg').controller('milestonecontroller', function ($scope, $modal){ $scope.editmilestonesdialog = function (objectid) { //fun } });
edit: allso felt should mention milestone directive repeated in ng-repeat loop. thanks!
ok you're going want use transcluded scope in directive pass controller function directive. directive becomes:
angular.module('ireg').directive('milestone', function (milestonefactory,$modal) { return { restrict:'e', scope: { objectid:'@objectid', editmilestonedialog:'&' }, templateurl: '/ireg/components/milestone/milestone.html', link: function ($scope, element, attrs) { $scope.edit = function(data) { $scope.editmilestonedialog(data); }; } }
and markup becomes:
<milestone edit-milestone-dialog="editmilestonedialog"></milestone>
Comments
Post a Comment