<div outter-directive>
<label name="innerLabel"></label>
<input name"inner" type="text" required ng-minlenght=40 placeholder="inner" ng-model="inner.dir" id="inner" etc.. inner-directive></input>
</div>
我想使用input中的inner-directive提取元素outter-directive。标签是任意的。我希望能够将inner-directive放在任何代码中，并让outter-directive能够使用附加的inner-directive属性提取该元素。
我也可以拥有以下内容并且仍然有效：
<div outter-directive>
<label name="innerLabel"></label>
<input name"inner" type="text" required ng-minlenght=40 placeholder="inner" ng-model="inner.dir" id="inner" etc..></input>
<input name"inner2" type="text" required ng-minlenght=40 placeholder="inner2" ng-model="inner.dir2" id="inner" etc..></input>
<div>
<input name"inner3" type="text" required ng-minlenght=40 placeholder="inner3" ng-model="inner.dir3" id="inner" etc.. inner-directive></input>
</div>
</div>
我看到了nested directives，但无法回答我的问题 有什么想法吗？
答案 0 :(得分：2)
您可以使用指令控制器和require:进行父指令和子指令之间的通信。
.directive('outerDirective', function () {
return {
controller: function () {
this.elements = [];
this.addElement = function (element) {
this.elements.push(element);
};
},
link: function (scope, element, attrs, outerCtrl) {
console.log(outerCtrl.elements); // this should contains children elements already.
}
};
})
.directive('innerDirective', function () {
return {
require: '^outerDirective', // require a controller of parent directive named 'outerDirective'
link: function (scope, element, attrs, outerCtrl) {
outerCtrl.addElement(element[0]); // tell the parent controller for an existence.
}
};
})
示例Plunker： http://plnkr.co/edit/F8JZeK7PRBoIHUYaTKtc?p=preview
答案 1 :(得分：0)
您可以使用常规DOM元素检索方法，例如querySelector。例如：
.directive('outterDirective', function() {
return {
link: function(scope, element) {
var innerElement = angular.element(element[0].querySelector('[inner-directive]'));
innerElement.addClass('active');
}
};
});
在上面的示例中，您将获得内部元素并向其添加active类以说明该方法。
如果您想要选择嵌套在querySelectorAll内的所有innerDirective元素，也可以使用outerDirective。