如何使用 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 秒。 如果您有所帮助，我将不胜感激。 谢谢...

Answer 1

像这样使用它怎么样：

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

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