从父组件上的条件* ngIf触发时，：leave过渡不起作用

Question

我有一个使用@angular/animations模块进行动画处理的组件，并且在使用{{1}创建或破坏了:host组件时，我无法运行动画。 }。

这里是一个例子：

*ngIf

在<blade *ngIf="showBlade"></blade> 内：

<blade>

模板：

animations: [
    trigger('bladeInOut', [
        transition(':enter', [
            style({ 'right': '-50vw' }),
            animate('200ms', style({ 'right': '0' })),
        ]),
        transition(':leave', [
            animate('200ms', style({ 'right': '-50vw' }))
        ])
    ])
]

当<div class="blade" [@bladeInOut]="':enter'"> 条件为*ngIf时，动画将按预期方式工作，并且从右侧向内滑动，它会滑入。但是，如果条件为false，则动画不会 run，只需将元素从DOM中删除，就会引起震撼的体验。

根据我所做的一些研究，主要是this线程，看来使用true和/或{{1}可以 }，但我没有任何运气。

有想法吗？