AngularJS animasyonları geçici olarak devre dışı bırakın

Question

Oldukça karmaşık bir ng-repeat sahibim. Görüntülenen öğelerin sayısı iki düğme ile kontrol edilebilir. ilk düğmesi ilk düğmeyi ng-yinelemeden bir filtre kullanarak kaldırır. ikinci düğme, bir dizi öğeyi kaldırır ve bir grup başka öğeyi görüntüler (ayrıca bir filtre kullanarak).

Şu anda böyle ng tekrar bir animasyon vardır:

<style> 
    .animation { 
    -webkit-transition: 1s; 
    } 
    .animation.ng-enter { 
    opacity: 0; 
    } 
    .animation.ng-enter.ng-enter-active { 
    opacity: 1; 
    } 
    /* Similar for ng-leave */ 
</style> 

<div class="animation" data-ng-repeat="item in items"> ... </div> 

Kullanıcı I elemanları animasyonu kullanmak isteyen birinci düğmesini tıkladığında

. Kullanıcı ikinci düğmeyi tıkladığında, herhangi bir animasyonu devre dışı bırakmak istiyorum.

AngularJS 1.2.16 kullanıyorum.

Answer 1

sınıfının koşullu olması için ng-class yönergesini kullanabilirsiniz. Bunu istemediğinizde animation sınıfını kaldırın, özellikle ikinci butona tıklayın. Yukarıdaki pasajı expression olarak

<div ng-class="{animation: expression }" data-ng-repeat="item in items"> ... </div> 

animation uzaklaştırılamaz ve animasyon devre dışı alacak, böylece false şekilde ayarlar durum/kapsamı değişken olacaktır.