我遇到需要访问多个指令 Controller 方法的情况。
我可以像这样使用 require 从父指令访问方法:
require:"^parentDirective"
但我还需要访问单独指令(不是父指令)中的方法,文档对 use an array of strings 说像这样:
require:["^parentDirective","directiveTwo"]
但这样做会导致错误,尽管这两个指令都已编译到 DOM 中。
我是不是漏掉了什么?
这是我的指令:
angular.module('testModule', ['parentModule'], function () {
}).directive('testDirective', function() {
return {
restrict: 'AE',
templateUrl: 'testTemplate.tpl.html',
scope: {
value1: "=",
value2: "="
},
require:['^parentDirective','otherDirective'],
controller: function($scope,$modal,socketConnection) {
if(case_x == true){
$scope.requiredController_1.ctrl1Func();
}
else if(case_x == false){
$scope.requiredController_2.ctrl2Func();
}
},
link: function(scope,element,attrs,requiredController_1,requiredController_2){
scope.requiredController_1 = requiredController_1;
scope.requiredController_2 = requiredController_2;
}
};
});
最佳答案
我认为这接近您想要的(希望如此):
http://plnkr.co/edit/WO6SROdVFOYlR22JQJPb?p=preview
这里有一些想法:
我认为
controller: function () {}
在向下执行,而link: function () {}
在向下执行备份方式(发生在它沿着 DOM 树走下去之后),这意味着您需要将依赖于其他 Controller 的代码从指令 Controller 移动到指令链接函数。利用
require
的指令只能在父元素(使用^
)或当前元素上要求指令。最初,您的 html 中有所有元素的 sibling 。如果需要的话,您需要将所有 sibling 包装在第四个指令中,它们都“require
”。当您执行
require: []
时,一个数组被传递到链接函数中。因此:link: function(scope, element, attrs, controllers) { var parent1 = controllers[0]; var other = controllers[1]; }
这是否回答了所有问题?
关于javascript - 在 Angularjs 中使用多个指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25506827/