我正在使用像这样的Angular指令:
'use strict';
var eventDirective = {
/**
* Initialize event directive and return the link
* calling all nested methods.
*
*/
init: function($scope, $element) {
var that = this;
return {
link: function(scope) {
scope.$watch('events', function() {
if (scope.events === undefined) {
return;
}
/**
* Every time the user access the event page, this methods
* will be called.
*
*/
__TableSorter__.init($element);
});
},
restrict: 'E'
};
},
__TableSorter__: {
init: function(element) {
console.log(element) // PRINTS ELEMENT
}
}
};
angular
.module('adminApp')
.directive('eventDirective', eventDirective.init.bind(eventDirective));
为了说明我创建了这个简单的例子。 TableSorter 将正常运行。
问题是当我有几个脚本时,代码太大了。有什么方法可以解决这个问题吗?也许把脚本放在其他地方作为工厂或服务?
我的问题是如何做到这一点。我试图在指令中注入一个服务但导致未定义。
感谢。
答案 0 :(得分:3)
一个好的方法应该是,当你定义你的指令时,你可以将bindToController
设置为true
并在控制器类中修改你的逻辑。您可以将您的服务注入该控制器。
例如。
myModule.directive('directiveName', function factory(injectables) {
var directiveDefinitionObject = {
template: '<div></div>',
scope: {},
controllerAs: 'yourControllerClass',
bindToController: true
};
return directiveDefinitionObject;
});
yourControllerClass
是角度控制器。