12

如何访问子指令控制器? 具体来说,我需要访问父指令中存在的所有ngModelController(s)。 例子:AngularJS - 访问子指令控制器

<parent-directive> 
    <input type="text" ng-model="model1"/> 
    <input type="text" ng-model="model2"/> 
</parent-directive> 

所以,是有 “parentDirective” 的方式来获得进入ngModelControllers为 “模型1” 和 “MODEL2”?

回答

10

更新

jqLit​​e extras methods还具有控制器方法来检索相关联的元件的特定控制器。因此,您可以查询ng模型并获取控制器名称angular.element(el).controller('ngModel')

控制器(名称) - 检索当前元素或其父元素的控制器。默认情况下,检索与ngController指令相关的控制器。如果名称是作为camelCase指令名称提供的,那么将检索该指令的控制器(例如'ngModel')。


角也放置在其数据元素相关联的控制器。与指令相关的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

+1

感谢您的承诺。这是解决方案。关键部分是“return angular.element(el).data('$ ngModelController');”。这行可以写成如下“return angular.element(el).controllwe('ngModel');”。通过该修改链接到您的Plnkr http://plnkr.co/edit/shn6978dFkH3YFfkUnRy?p=preview – Christian

+0

哦,是的,我实际上已经忘记了这个jqlite额外。谢谢。我会更新我的答案。 – PSL