使用自定义指令,您将如何根据特定条件在宿主元素上添加/删除类?
示例:
@Directive({
selector: '[customDirective]'
})
export class CustomDirective {
constructor(service: SomService) {
// code to add class
if (service.someCondition()) {
// code to remove class
}
}
}
最佳答案
如果你不想使用 ngClass
指令(提示:你可以传递一个函数给 [ngClass]="myClasses()"
如果它是在你的模板中进行困惑的内联)你可以使用 Renderer2
为它添加一个或多个类:
export class CustomDirective {
constructor(private renderer: Renderer2,
private elementRef: ElementRef,
service: SomService) {
}
addClass(className: string, element: any) {
this.renderer.addClass(element, className);
// or use the host element directly
// this.renderer.addClass(this.elementRef.nativeElement, className);
}
removeClass(className: string, element: any) {
this.renderer.removeClass(element, className);
}
}
关于angular - 如何从指令中添加/删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41520681/