使用 json 响应生成动态列表

【问题标题】：Generating dynamic list with json response使用 json 响应生成动态列表
【发布时间】：2017-03-12 06:04:27
【问题描述】：

我有一个像下面这样的 json 数组；

"collectings": [
    {
      "hint": "OPEN",
      "amount": 24
    },
    {
      "hint": "CREDIT CARD",
      "amount": 347
    },
    {
      "hint": "CASH",
      "amount": 256.5
    }
  ]

现在，我想在列表中动态显示这些数据，我正在尝试像下面这样；

<ion-content>
<div class="row" *ngIf="collectings && collectings.length > 0">
  <ion-list>
    <ion-list-header>Comedy</ion-list-header>
    <ion-item *ngFor="let collecting of collectings">{{collectings}}</ion-item>
  </ion-list>
</div>
</ion-content>

但是，它显示在页面上，如下图所示；如何正确显示？

【问题讨论】：

标签： angular typescript ionic-framework ionic2

【解决方案1】：

而不是{{ collectings }}（这是数组）

<ion-item *ngFor="let collecting of collectings">{{collectings}}</ion-item>

您应该打印collecting 属性（不带结尾s）并使用hint 或amount 子属性，如下所示：

 <ion-item *ngFor="let collecting of collectings">
   {{collecting.hint}} - {{ collecting.amount }}
 </ion-item>

【讨论】：

@sebaferreas 我已经尝试过了，但是当我这样做时，它什么也没显示。我已经用 ngIf 部分检查了数组是否为空，因为我从 rest 获取数组作为响应并将其绑定到我的数组。
@sebaferreas 是的，你是对的。我正在打印收藏品。现在，它的工作