Utilizzo di "require" nella direttiva per richiedere un controllore genitore

Question

Provo a "richiedere" un controller padre (non direttiva) ma AngularJS restituisce un'eccezione. Il codice è simile a questo:

JS

app.controller("myController", function ($scole) { 
    ... 
}); 

app.directive("myDirective", function ($q) { 
    return { 
     require: "^myController", 
     template: "", 
     link: function (scope, element, attrs, myCtrl) { 
      ... 
     } 
    }; 
}); 

HTML

<div ng-controller="myController as myCtrl"> 
    ... 
     <div my-directive>...</div> 
    ... 
</div> 

errore

Error: [$compile:ctreq] Controller 'myController', required by directive 'myDirective', can't be found!

Perché?
Forse, require proprietà deve essere riferimento a un controller di direttiva?

Grazie

Answer 1

richiede è di utilizzare altri controller direttive in un'altra direttiva, si rinvia l'esempio seguente

var App = angular.module('myApp',[]); 

//one directive 

App.directive('oneDirective',function(){ 

    return { 
     restrict: 'E', 
     controller:function($scope){ 

     $scope.myName= function(){ 
      console.log('myname'); 
      } 

     } 
    } 

}); 

    //two directive 

    App.directive('twoDirective',function(){ 

    return { 
     require:'oneDirective' //one directive used, 
     link : function(scope,ele,attrs,oneCtrl){ 
     console.log(oneCtrl.myName()) 
    } 

    } 

    }) 

Answer 2

notazione require: "^myController" significa che la vostra direttiva tenterà di accedere a un'altra direttiva chiamato myController e definito su alcuni dei tag antenati come my-controller attributo o <my-controller> tag. Nel tuo caso non hai tale direttiva, quindi l'eccezione.

questo non è molto convenzionale, ciò che si sta cercando di fare, ma se si davvero desidera richiedere controllore esterno nella vostra direttiva è possibile richiedere ngController:

app.directive("myDirective", function($q) { 
    return { 
     require: "^ngController", 
     template: "", 
     link: function(scope, element, attrs, myCtrl) { 
      // ... 
      console.log(myCtrl); 
     } 
    }; 
}); 

Tuttavia, questo non è molto buona idea . Non riesco a immaginare perché potresti averne bisogno in questo modo. Raccomanderei di esaminare le proprietà di configurazione scope e come passare i riferimenti di funzione eseguibili nella direttiva dal controller esterno.

<div my-directive some-callback="test()"></div> 

e nella direttiva definire il campo:

scope: { 
    someCallback: '&' 
} 

dove nel controller che si avrebbe $scope.test = function() {};. Quindi non è necessario richiedere il controller in modo esplicito nella direttiva.