12

Come accedere ai controller di direttive figlio? In particolare, ho bisogno di accedere a tutti i ngModelController (s) presenti all'interno di una direttiva padre. Esempio:AngularJS - Controller di controllo figlio di accesso

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

Quindi, c'è un modo per "parentDirective" per ottenere l'accesso ai ngModelControllers per "model1" e "model2"?

risposta

10

Aggiornamento

jqLite extras methods ha anche un metodo di controllo per recuperare il controller specifico associato all'elemento. Quindi puoi richiedere i modelli ng e ottenere il nome del controller come angular.element(el).controller('ngModel').

controller (nome): recupera il controller dell'elemento corrente o suo padre. Di default recupera il controller associato alla direttiva ngController. Se il nome viene fornito come nome della direttiva camelCase, verrà recuperato il controller per questa direttiva (ad esempio 'ngModel').


angolare pone anche il controllore associato con un elemento ai relativi dati. Analogamente, l'istanza del controller ngModel associata alla direttiva è accessibile tramite $ngModelController. In questo modo è possibile accedervi e utilizzare l'istanza ngModel per fare tutto ciò che si sta facendo. Tuttavia questo è completamente un modo non standard di farlo, perché $ngModelController non è documentato e non vi è alcuna garanzia che l'implementazione non cambierà nelle versioni future.

un esempio di implementazione:

.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

Grazie per il vostro impegno. Questa è la soluzione. La parte crutiale è "return angular.element (el) .data ('$ ngModelController');". Anche questa riga potrebbe essere scritta come segue "return angular.element (el) .controllwe ('ngModel');". Link al tuo Plnkr con quella modifica http://plnkr.co/edit/shn6978dFkH3YFfkUnRy?p=preview – Christian

+0

Oh sì, in realtà mi ero dimenticato degli extra jqlite su questo. Grazie. Aggiornerò la mia risposta – PSL