ngclass在angular 6中的工作方式与预期不同

我试图根据数组中存在的值更改[ngclass]字段的值，但它没有按预期工作。 html代码如下所示：

<ul>
                  <li [ngClass]="{active: uniqueIds == corporate }">
                    <a href="/questionnaire/"> 
                      <span class="icons">
                        <i class="fas fa-users"></i>
                    </span> 
                      <span>Corporate</span> 
                    </a>
                  </li>
                  <li id="dispatchLocations" [ngClass]="{active: uniqueIds == dispatchLocations}">
                    <a href="/questionnaire/three/"> 
                      <span class="icons">
                        <i class="fas fa-map-marked-alt"></i>
                    </span> 
                      <span>Dispatch locations  </span> 
                    </a>
                  </li>
</ul>

private message = [];
private questionLiId: any;
liIds: Array<any>;
  public uniqueIds : Array<any>;
 constructor(private sharedMessage: ShareMessageService) {
    this.liIds =[];
    this.uniqueIds=[];
  }
ngOnInit() {
    this.sharedMessage.shareMessage$.subscribe((data) => {
      this.message = data;
      this.questionLiId=this.message[4];
      setTimeout(()=>{
        this.liIds.push(this.questionLiId);
        this.uniqueIds =Array.from(new Set(this.liIds));
        console.log("Unique Li Ids =>"+this.uniqueIds);
      },0)
    })
  }

Unique Li Ids =>corporate,dispatchLocations

当我在控制台中看到唯一的li ID时，打印如下：

<ul>
                  <li [ngClass]="{active: uniqueIds == corporate }">
                    <a href="/questionnaire/"> 
                      <span class="icons">
                        <i class="fas fa-users"></i>
                    </span> 
                      <span>Corporate</span> 
                    </a>
                  </li>
                  <li id="dispatchLocations" [ngClass]="{active: uniqueIds == dispatchLocations}">
                    <a href="/questionnaire/three/"> 
                      <span class="icons">
                        <i class="fas fa-map-marked-alt"></i>
                    </span> 
                      <span>Dispatch locations  </span> 
                    </a>
                  </li>
</ul>

private message = [];
private questionLiId: any;
liIds: Array<any>;
  public uniqueIds : Array<any>;
 constructor(private sharedMessage: ShareMessageService) {
    this.liIds =[];
    this.uniqueIds=[];
  }
ngOnInit() {
    this.sharedMessage.shareMessage$.subscribe((data) => {
      this.message = data;
      this.questionLiId=this.message[4];
      setTimeout(()=>{
        this.liIds.push(this.questionLiId);
        this.uniqueIds =Array.from(new Set(this.liIds));
        console.log("Unique Li Ids =>"+this.uniqueIds);
      },0)
    })
  }

Unique Li Ids =>corporate,dispatchLocations

当我检查html代码时，将显示以下内容：

<li _ngcontent-c4="" ng-reflect-ng-class="[object Object]">Corporate</li>

---

但是以上这些对我都不起作用。

corporate

应该是一个字符串：

[ngClass]="{'active': uniqueIds.indexOf('corporate') !== -1 }"

---

尝试从控制器调用方法

[ngClass]="getLiClass(uniqueIds, 'corporate')"

在控制器中。添加该功能：

   getLiClass(uniqueIds, testValue) {
     return uniqueIds.contains(testValue) ? 'active':'inactive';
   }

---

试试这个。。因为

uniqueIds

是一个数组，所以需要搜索它的索引。我认为这是更简单的方法

 <li [ngClass]="{'active': uniqueIds.indexOf('corporate')!= -1 }">

---

欲了解更多信息，请点击此链接

了解

公司

和

派送地点

应该是什么？它们是弦吗？组件类的成员？