Angolare ng-animate 1.3. * Causa comportamento inatteso per la classe ng all'interno della direttiva

Question

Sono nel mezzo della transizione dalla versione 1.2. * Alla 1.3. *, E mi sono imbattuto in uno strano critico bug.

Nella mia domanda ho una molto semplice directive contenere un template con ng-class (con condizione alla proprietà campo di applicazione) per qualche motivo non funziona con 1.3. * Versione, ed è il lavoro bene con 1.2. * Versione.

Dai un'occhiata a questo Plunker per illustrare il problema.

Questo codice Plunker è con versione angolare 1.2. * E, come potete vedere, funziona bene.

provare a cambiare la versione angolare (index.html)

<script src="https://code.angularjs.org/1.3.9/angular.js"></script> 
    <script src="https://code.angularjs.org/1.3.9/angular-animate.js"></script> 
    <!--<script src="https://code.angularjs.org/1.2.28/angular.js"></script> 
    <script src="https://code.angularjs.org/1.2.28/angular-animate.js"></script>--> 

Aggiorna pagina, e poi si può vedere il bug:
angolare non aggiorna il ng classe secondo al cambiamento della proprietà "attiva".

Ho cercato di capire cosa può causare questo errore, e dopo molti tentativi ho trovato che il modulo 'ngAnimate' causa questo problema. cercare di eliminare i 'ngAnimate' di dipendenza (script.js):

//var app = angular.module('app', ['ngAnimate']); 
    var app = angular.module('app', []); 

E poi si può vedere che tutto va bene, così 'ngAnimate' versione 1.3 * induce a questo problema..

Quindi è AngularJS bug, ho ragione?

In caso contrario, cosa sto facendo male?

Answer 1

Avete qualche ragione specifica per utilizzare l'opzione replace nella direttiva? In caso contrario, puoi semplicemente rimuoverlo e funziona perfettamente. Link al plunker lavorare con 1.3.9 Angolare:

http://plnkr.co/edit/jLIS9uJ1PHC64q6nEmtB?p=preview

V1.3.9 docs dicono che replace è deprecato e molto raramente necessario per le direttive di lavorare, e apparentemente nel tuo caso anche riuscito a causare qualche problema.

Answer 2

Come per il documento replace sarà deprecato nella versione 2. Poiché si utilizza Angular 1.3.9, che dovrebbe andare bene.

Per risolvere questo problema o è possibile rimuovere replace dalla direttiva o ancora se si desidera utilizzare replace poi avvolgere il contenuto del modello di direttiva che ha ng-transclude in un div come qui di seguito

<div><div ng-click='click()' ng-class='{\"{{defaultColorClass}}\" : !active, \"{{activeColorClass}}\": active, \"mousePointer\" : !active}' class='k-content-button-inner-style {{effectClass}} {{externalClass}}' ng-transclude></div></div>

Per ulteriori informazioni fare riferimento - https://docs.angularjs.org/api/ng/directive/ngTransclude, Explain replace=true in Angular Directives (Deprecated).

Answer 3

@bensiu: La rimozione della variabile * non utilizzata {{effectClass}} nel template lo farà funzionare per 1.4.4 nell'esempio plunker collegato alla domanda.

Modificato Plunk here

* Edit: Probabilmente dovrei dire "utilizzando una variabile non in ambito" piuttosto che "variabile inutilizzata".