user3810167 user3810167 - 2 months ago 27
AngularJS Question

Ng-repeat animation not working in IE11

I have this ng-repeat code, but not working in IE 11

<div class="cardSegmentation moveUp"
style="animation: moveUpA {{ (0.5 + 0.1 * $index) + 's' }} ease forwards;animation-delay: 400ms;-webkit-animation: moveUpA {{ (0.5 + 0.1 * $index) + 's' }} ease forwards;-webkit-animation-delay: 400ms;"
ng-repeat="typesCard in quizzesTypes"
ng-click="sendTypeSegm(typesCard.id)">


In the element inspector, no content is shown in this element:

{{ (0.5 + 0.1 * $index) + 's' }}


any help please ..

Thank

Answer

I doesn't recognize it as valid HTML & do nothing with it.

You can either use ng-attrs-style or ng-style directive like I shown below.

<div class="cardSegmentation moveUp" 
  ng-style="{
     animation: 'moveUpA '+(0.5 + 0.1 * $index) + 's ease forwards',
     animation: 'moveUpA '+ (0.5 + 0.1 * $index) + 's ease forwards',
     -webkit-animation: 'moveUpA '+ (0.5 + 0.1 * $index) + 's ease forwards'
  }"
  style=" animation-delay: 400ms; ; -webkit-animation-delay: 400ms;" 
  ng-repeat="typesCard in quizzesTypes" 
  ng-click="sendTypeSegm(typesCard.id)">