如何使用带有 ngClass 的函数中的变量？

Question

使用 Angular 4，我试图通过比较变量 sender 在函数中创建和数组中的对象 item.sender.[=15 来使用 ngClass =]

这是HTML:

<ion-card *ngFor="let item of items" [ngClass]="{'me': item.sender == sender, 'notme': item.sender != sender}">
  <ion-card-header>
    @{{item.sender}}
  </ion-card-header>
  <ion-card-content>
    {{item.message}}
  </ion-card-content>
</ion-card>

变量为sender的函数为：

send(desc: string) {
  console.log("message:", desc);

  var listkey = this.listKey;
  var user = firebase.auth().currentUser;
  var uid = user.uid;
  var email = user.email;
  var sender = email.substring(0, email.lastIndexOf("@"));

  var messagecontent = {
    message: this.messagecontent,
    sender: sender,
  };

  firebase.database().ref('userlists' + '/' + listkey +  '/' + 'chat').push(messagecontent);
  this.messagecontent = '';
}

这可以完成吗？如果可以，我还缺少什么？

Answer 1

  public  sender:string = '';


   send(desc: string) {
     console.log("message:", desc);
    ... 
      this.sender = email.substring(0, email.lastIndexOf("@"));
    ....

您还最好将所有 var 替换为 let 和 const。

Answer 2

可以用三元方程申请ngClass

代码

<ion-card *ngFor="let item of items" [ngClass]="item.sender === sender ? me : notme">
  <ion-card-header>
    @{{item.sender}}
  </ion-card-header>
  <ion-card-content>
    {{item.message}}
  </ion-card-content>
</ion-card>

如何使用带有 ngClass 的函数中的变量？

How can I use a variable from a function with ngClass?

typescript

angular

angular5