Javascript 带hostlistener的Angular中的活动类

如何删除li标记上的活动类？我有一个在li标记上添加活动类的代码，但我无法删除此活动类

   @Directive({
  selector: '[appHome]'
  
})
export class HomeDirective{
  ref!: ElementRef;

  @HostBinding('class.active')isActive=false;



  @HostListener('click')onClick(){
    
    if(!this.isActive){
      this.isActive=true;
      return;
    }
    
    }
    

{{wd.titleName}

我认为您需要的是切换行为。如果是这样，请更换以下部件

if(!this.isActive){
  this.isActive=true;
  return;
}

与

如果要有条件地添加活动类，可以在列表项上使用

ngClass

，如下所示

<li [ngClass]="{'active' : isActive == true}">List Item</li>

列表项

---

如果我写这段代码，它将作为一个切换，我想删除以前的活动类，请查看我的编辑，以防有帮助。

this.isActive = !this.isActive;

<li [ngClass]="{'active' : isActive == true}">List Item</li>