How to animate children when ngClass changes to parent

Question

Is it possible to define transitions for child elements and take into account that ngAnimate takes them into account when changing ngClass for parent elements?

So far I have not been able to do this.
http://plnkr.co/edit/ulq1MQNDtY9cO2pcjdzF?p=preview

Thanks.

Answer 1

I don’t think it’s possible, how are you trying to do it. Angular looks for animation / transition properties in the base class to determine the time. But in your case, all these properties are defined in the child. Since the result of Angular cannot connect the necessary animation hooks.

, Angular, . :

.container {
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

, Angular , .

plunk.

, transition-duration: 1s - , :

.container {
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    -ms-transition-duration: 1s;
    transition-duration: 1s;
}