如何访问子指令控制器? 具体来说,我需要访问父指令中存在的所有ngModelController。 例如:
<parent-directive>
<input type="text" ng-model="model1"/>
<input type="text" ng-model="model2"/>
</parent-directive>
那么,“parentDirective”是否有办法访问“model1”和“model2”的ngModelControllers?
答案 0 :(得分:11)
<强>更新强>
jqLite extras methods还有一个控制器方法来检索与该元素关联的特定控制器。因此,您可以查询ng-models并将控制器名称也设置为angular.element(el).controller('ngModel')
。
controller(name) - 检索当前元素或其父元素的控制器。默认情况下,检索与ngController指令关联的控制器。如果name作为camelCase指令名提供,则将检索该指令的控制器(例如&#39; ngModel&#39;)。
angular还将与元素关联的控制器放在其数据上。类似地,与指令关联的ngModel控制器实例可通过$ngModelController
访问。因此,您实际上可以访问它并使用ngModel实例来执行您正在执行的操作。然而,这完全是一种非标准的方式,因为$ngModelController
没有文档记录,并且无法保证在将来的版本中实现不会改变。
示例实现:
.directive('parentDirective', function($timeout){
return{
restrict:'E',
link:function(scope, elm){
/*Get the elements with the attribute ng-model, in your case this could just be elm.children()*/
var elms = [].slice.call(elm[0].querySelectorAll('[ng-model]'), 0);
/*get the ngModelControllerArray*/
var controllers = elms.map(function(el){
return angular.element(el).controller('ngModel');
//return angular.element(el).data('$ngModelController');
});
/*As a sample implementation i am registering a view value listener for these controller instances*/
controllers.forEach(function(ngModel){
ngModel.$viewChangeListeners.push(logViewChange.bind(null, ngModel));
});
function logViewChange(ngModel){
console.log(ngModel.$name, ngModel.$viewValue);
}
}
}
});
<强> Plnkr 强>