AngularJs: Direttiva alla comunicazione del controller con scope.Applicare non funziona

Question

Ho un mainCroller e una direttiva annidata.Sto guardando Questo esempio per vedere come ilLa comunicazione funziona tra controller e direttiva, ma il mio non sembra funzionare.

Fondamentalmente, voglio chiamare una funzione di ambito del controller principale da una direttiva personalizzata (pulsante vuoto del pulsante).Vedi l'esempio di Plunkr qui sotto.

Plukr: http://plnkr.co/edit/82stlkkxbk6httnmnqlu?p=preview

Ogni volta che faccio console.log (scope. $ applicare ("vuoto (vuoto ()")), è undefined per qualche motivo.

Nota: sto cercando di evitare $ rootscope.Broadcast il più possibile ...

Answer 1

Stai utilizzando la portata Isolato per la Direttiva Parentaletica, quindi la direttiva figlio non ha accesso all'ambito del controller.

Al fine di fornire la direttiva figlio con accesso a tale funzione di ambito mantenendo il mantenimento dell'isolamento del genitore, è possibile aggiungere tale funzione come proprietà scope: { ... } sulla direttiva madre:

scope: {
  ...
  emptyCart: '='
}

.

e impostare il nome della funzione nell'attributo corrispondente sulla Dichiarazione di vista della Direttiva Parentata:

<div ... data-show="showPopup" empty-cart="emptyCart"></div>

.

Allora puoi saltare tutte le soluzioni alternative che hai tentato di impiegare nel tuo pinkeer e semplicemente impostare un ng-click sulla direttiva figlio per sparare la funzione del controller:

sHTML = "<button ... ng-click='emptyCart()'>Empty cart</button>";

.

demo