angular - 如何用Angular6制作无限动画？

Question

我使用 html 和 css 制作了一辆 3d 卡车。如果任何变量 ( x ) 为真，则卡车轮胎旋转 360 度。如果 x=false，卡车轮胎停止转动。我用 css 做这个，只是为了无限旋转。

.whell{
   animation: round 2s infinite linear ;
}

 @keyframes round {
   from {
     transform: rotate(0deg);
   }
   to {
     transform: rotate(360deg);
   }
   }

此 css 代码正在工作，但不会根据变量停止轮胎。我决定用 Angular Animations 制作；

animations: [

    trigger('x',[
      state('true', style({
        transform: 'rotate(360deg)'

      })),

      transition('* => *', animate('2s'))

    ])
  ]

卡车的轮胎正在旋转，但只有 2 秒。有没有办法在 Angular6 中无限旋转它？我想要无限，而不是 2 秒。如果您能提供帮助，我将不胜感激。谢谢...

标签： angulartypescriptanimation

Answer 1

像这样使用它怎么样：

[ngClass]="x?'whell':'classWithNoAnimation'"

如果 x 为真，则切换到地狱，否则切换到 classWithNoAnimation