Function ngClass上的函数调用不起作用

我在使用Ionic 2和Firebase构建应用程序时遇到ngClass和函数问题。 函数确实可以工作，但函数的值不在HTML代码中。我以此为例：

html和对函数的调用如下所示：

<button  ion-button class="chatbutton" [ngClass]="compareUser(user.$key)"
(click)="gotoDoctorChat(user.$key)" >{{user.naam}} </button>

  compareUser(uid){
this.angFire.database.object('/users/' + uid +'/'+ this.coach1+'red').subscribe(snapshot=>{
  console.log("snapshot.tostring = " + snapshot.$value);
  if(snapshot.$value === '0'){
    return 'unread';
  }else{
    return null;
  }
})

.unread{
    background-color: red!important;
}

})

CSS如下所示：

<button  ion-button class="chatbutton" [ngClass]="compareUser(user.$key)"
(click)="gotoDoctorChat(user.$key)" >{{user.naam}} </button>

  compareUser(uid){
this.angFire.database.object('/users/' + uid +'/'+ this.coach1+'red').subscribe(snapshot=>{
  console.log("snapshot.tostring = " + snapshot.$value);
  if(snapshot.$value === '0'){
    return 'unread';
  }else{
    return null;
  }
})

.unread{
    background-color: red!important;
}

---

请询问是否有不清楚的地方。

尝试用单引号（'）括起来，如下图所示

return "'unread'";

还要确保在主组件中导入了正确的模块

import { NgClass } from '@angular/common';

---

原因是函数

compareUser

在解析内部函数调用之前总是返回undefined

您可以使用以下方法对此进行测试：

console.log(compareUser(aUID));

---

在不了解更多逻辑/需求的情况下，很难提出替代方案。

如果您可以尝试为您的问题提供JSFIDLE/codepen，这将是一件好事。它将帮助我们找到原因。