Comment animer la totalité d'une ligne de tableau en Angular sans affecter la bordure de la ligne de tableau ?

Question

J'ai un tableau qui dépend des modifications apportées aux cellules individuelles du tableau. Si une cellule du tableau est modifiée, je veux animer cette cellule, mais aussi toutes les autres cellules du tableau.

J'utilise le nom de la classe "ng-anmiate ng-enter".

Mon css pour animer la ligne est le suivant.

.ng-enter {
   -webkit-animation: fadeIn 2s;
   -moz-animation: fadeIn 2s;
   -ms-animation: fadeIn 2s;
   animation: fadeIn 2s;
}

Lorsque j'anime l'ensemble de la ligne, la bordure s'efface puis réapparaît (je ne veux pas d'animation sur la bordure, seulement sur toutes les cellules de la ligne du tableau).

Comment faire pour que ça marche ?

Answer 1

Ok, est-ce que c'est le comportement que vous voulez ? J'ai ajouté un span en td et ensuite dans css :

.ng-enter span {
   -webkit-animation: fadeIn 2s;
   -moz-animation: fadeIn 2s;
   -ms-animation: fadeIn 2s;
   animation: fadeIn 2s;
}

Voici le plunker : https://plnkr.co/edit/ZCv9M8QzW1jO5WzBj8OG?p=preview