Question

我正在学习离子4，并且在打开晶圆厂列表时动态更改fab list内容时遇到问题。

我试图实现这一点，即在选择主要晶圆厂之后，用户将看到随时间变化的按钮列表。下面是示例-srv.getProblems()将返回最后5个问题，这些问题会随着时间而变化。

  <ion-fab vertical="top" horizontal="end" *ngIf="srv.getProblems().length>0">
    <ion-fab-button color="danger">Problems</ion-fab-button>
    <ion-fab-list side="bottom">
      <ion-fab-button color="danger" *ngFor="let p of srv.getProblems()"> 
         {{p.name}}
      </ion-fab-button>
    </ion-fab-list>
  </ion-fab>

和srv.getProblems就像：

return this.problems.filter((item, index) => index < 5 );

从其他地方更新this.problems的地方。

当前结果是，当srv.getProblems（）的结果更改时，列表中新增的按钮将添加到DOM中，但不可见。当我隐藏并重新打开晶圆厂列表时，我可以正确看到它们。

如何更改它以正确显示动态更改的按钮？

Answer 1

就像阿米尔·阿巴比安（Amir Arbabian）所建议的那样，我检查了隐形按钮中缺少的内容=它是fab-button-show类。我将其手动添加到模板中，如下所示：

<ion-fab-button class="fab-button-show" color="danger" *ngFor="let p of srv.getProblems()">

，看来现在可以正常使用了。我认为这是一个错误，但是我将尝试报告它。

Ionic 4 FAB列表动态更改内容

1 个答案: