在使用Angular 2动画时,自动添加的ng-tns类可以通过以下方法进行删除:
.ng-tns {
all: initial !important;
}
这将覆盖ng-tns类的所有样式,并将其设置为初始值。
import { AnimationEvent } from '@angular/animations';
@Component({
// 组件配置
})
export class MyComponent implements OnInit {
onAnimationDone(event: AnimationEvent) {
if (event.toState === 'void') {
const element = event.element as HTMLElement;
element.classList.remove('ng-tns');
}
}
}
在模板中,可以将onAnimationDone函数绑定到动画的[@triggerName].done事件上,以便在动画完成后调用该函数。
import { Renderer2 } from '@angular/core';
@Component({
// 组件配置
})
export class MyComponent {
constructor(private renderer: Renderer2) {}
removeNgTnsClass() {
const element = document.getElementById('myElement');
this.renderer.removeClass(element, 'ng-tns');
}
}
在模板中,可以通过调用removeNgTnsClass函数来删除ng-tns类。
以上是删除在使用Angular 2动画时自动添加的ng-tns类的几种方法。根据具体情况选择适合的方法进行操作。
云+社区技术沙龙[第28期]
企业创新在线学堂
云+社区技术沙龙[第14期]
云+社区技术沙龙[第17期]
腾讯云GAME-TECH游戏开发者技术沙龙
技术创作101训练营
Elastic 中国开发者大会
第四期Techo TVP开发者峰会
云+社区技术沙龙[第25期]
serverless days
领取专属 10元无门槛券
手把手带您无忧上云