angular - Angular 5从兄弟姐妹中删除类

Question

我正在尝试创建一个具有多个角度超链接的导航栏。我想在任何超链接的单击/悬停时添加“活动”类，并从其兄弟姐妹中删除“活动”类。我正在尝试通过创建自定义指令来做到这一点。

这就是我所取得的成就。

import { Directive, ElementRef, HostListener, Renderer2 } from '@angular/core';

@Directive({
   selector: '[AppHighlightActiveMenu]'
})
export class HighlightMenuDirective {

constructor(private element: ElementRef, private renderer: Renderer2) { }

@HostListener('mouseenter') onMouseEnter() {
   this.activate();
}

@HostListener('mouseleave') onMouseLeave() {

}

private activate() {
  this.renderer.addClass(this.element.nativeElement, 'active'); 
}

private deactivate(element: ElementRef) {
  console.log("Element: ", element);
}
}

我能够将活动类添加到元素中，但不能从兄弟姐妹中删除已经存在的活动类。

提前致谢。

Answer 1

你试过removeClass吗？

 removeClass(className: string, element: any) {
   this.renderer.removeClass(element, className);
}

但是对于导航栏，为什么不使用<router-outlet>withrouterLinkActive="active"作为链接，Angular 中默认的内置指令在哪里。