angular – 如何在指令中添加/删除类

我有一个自定义指令,应该能够根据其他条件添加/删除类.

即

// imports 

@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);
   }

}