带有角度指令ngIf

我开始使用animejs,我想在Angular应用程序中包含一个动画。

在尝试这样做时,我发现当放置动画的div取决于指令ngIf时,动画不起作用。当ngIf中的条件为true时,图像会正确加载,但不会进行动画处理。删除指令可以解决问题,但我想有条件地显示它。

JS:

var value = 2;

anime({
  targets: '#rod',translateX: 70,easing: 'linear',loop: true
});

CSS:

#rod{
  width: 100px;
  height: 100px;
  background-color: red;
}

HTML运行正常:

<div id="rod">
</div>

HTML没有动画:

<div id="rod" *ngIf="value > 0">
</div>

HTML也不起作用:

<div *ngIf="value > 0">
    <div id="rod">
    </div>
</div>

我应该做些什么来使动画与Angular指令一起工作吗? 我正在使用Angular 8.2.14。

jinruien0219 回答:带有角度指令ngIf

使用* ng如果未渲染HTML,则动画无法正常运行。您可以尝试使用 [隐藏] 属性吗?

希望这会有所帮助!

谢谢。

本文链接:https://www.f2er.com/2900743.html

大家都在问