di direttiva accesso da elementi transclusa

Question

ho il seguente scenario: Una direttiva transclude con ambito isolato che ha un controller collegato in esso:

angular.module('app', []) 
.directive('hello', function() { 

    return { 

    controller: function($scope) { 
     $scope.hello = "Hello World"; 
    }, 

    restrict: 'E', 
    replace: true, 
    transclude: true, 
    template: '<div class="hello" ng-transclude></div>', 
    scope: {} 
    }; 

}); 

Non vedo l'ora di accedere al controller della direttiva dagli elementi transclusa :

<hello> 
    <h1>Hello Directive</h1> 

    <p>{{ hello }}</p> 
</hello> 

Tuttavia ciò non sembra possibile. Ho provato ad accedere a hello con $parent e $$nextSibling.

Esiste qualche soluzione per questo scenario? Non riesco a mettere il controller in wrapper attorno all'istanza direttiva.

ho creato un codepen per illustrare questo comportamento: http://codepen.io/jviotti/pen/ktpbE?editors=101

Answer 1

È necessario passare la variabile nella direttiva ciao come vincolante, e includere anche come parte dell'ambito isolato: http://codepen.io/anon/pen/yoCkp

Maggiori informazioni qui: Confused about Angularjs transcluded and isolate scopes & bindings

Edit:

nell'esempio originale, il modello prevede la variabile {{ciao}} nel campo di applicazione della radice genitore, bu t è in realtà nell'ambito della direttiva hello. In effetti, l'ambito isolato vuoto nella direttiva significa che non otterrà alcuna variabile di ambito dal suo genitore. Quindi, ciò che fa la modifica di cui sopra è instradare la variabile ciao (inesistente) dall'ambito della radice nella direttiva e quindi imposta il valore.

Per ulteriori informazioni, è possibile dare un'occhiata a questo: http://codepen.io/anon/pen/pJEqjq - vedrete che il controller sta impostando $rootScope.hello e funziona pure. Anche se questo non è consigliato perché fare affidamento sulle variabili rootScope tra diversi controller può essere complicato.