在使用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类的几种方法。根据具体情况选择适合的方法进行操作。
领取专属 10元无门槛券
手把手带您无忧上云