有没有办法计算Angular html页面中的所有循环布尔值

Question

有没有办法计算Angular html页面中的所有循环布尔值

this.items = [{
    id:1,
    isUpdate: false
  },
  {
    id:2,
    isUpdate: true
  },
  {
    id:3,
    isUpdate: true
  }

只要其中一个isUpdate值为true,无论isUpdate值为多少,通知组件都会显示并只显示一次.

我想知道是否有办法计算app.component.html页面中的布尔值,以查看isUpdate值中是否至少有一个为true并显示通知组件.而且我不想多次显示通知组件,只显示一次.

到目前为止,我的代码如下所示,它会多次显示通知:

app.component.html
<div *ngFor = "let notification of items">
  <notification *ngIf="notification.isUpdate"></notification>
</div>

和

Notification.component.html
<alert type="warning">
  <span class="icon-notification"></span>  Ready to update.
</alert>

先感谢您.

Answer 1

如果应该显示通知,写一个将返回的函数:

showNotification(): boolean {    
  this.items.forEach(item => {
    if (item.isUpdate) {
      return true;
    }
  });

  return false;
}

并将其绑定到您的模板:

<notification *ngIf="showNotification()"></notification>