AngularJS

Question

如何访问子指令控制器？具体来说，我需要访问父指令中存在的所有 ngModelController。示例：

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

那么，"parentDirective" 有没有办法访问 "model1" 和 "model2" 的 ngModelControllers？

Answer 1

更新

jqLite extras methods 也有一个控制器方法来检索与元素关联的特定控制器。因此，您可以查询 ng-models 并将控制器名称也设为 angular.element(el).controller('ngModel')。

controller(name) - retrieves the controller of the current element or its parent. By default retrieves controller associated with the ngController directive. If name is provided as camelCase directive name, then the controller for this directive will be retrieved (e.g. 'ngModel').

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

AngularJS - 访问子指令控制器

AngularJS - Access child directive controller

javascript

angularjs-directive

angularjs-scope

angularjs-ng-model