如何在 Ionic / Angular 中访问 json 对象答案

【问题标题】：How to access json object in Ionic / Angular如何在 Ionic / Angular 中访问 json 对象
【发布时间】：2017-08-16 11:52:48
【问题描述】：

我需要访问这个 json 中的 firstBill 值：

[{
    "companyName": "Madrid",
    "producCompanyId": 4,
    "productCompanyName": "Empresa1",
    "state": {
        "id": 5,
        "description": "Completada sin precios"
    },
    "message": "\nHay otra empresa igual en ACTIVO                                              "
}, {
    "companyName": "Barcelona",
    "producCompanyId": 10,
    "productCompanyName": "Empresa2",
    "companyResultId": "889",
    "state": {
        "id": 4,
        "description": "Completada con precios"
    },
    "prices": {
        "priceList": [{
            "priceId": 699614,
            "companyPriceId": "1091931204",
            "firstBill": 281.96,
            "issuable": true
        }, {
            "priceId": 699609,
            "companyPriceId": "1091931204",
            "firstBill": 251.64,
            "issuable": true
        }, {
            "priceId": 699611,
            "companyPriceId": "1091931204",
            "firstBill": 302.6,
            "issuable": true
        }]
    },
    "message": ""
}]

现在我有了这段代码，但由于其他（前一个 json 中的第一个）对象中未定义 prices jsonarray 而出现错误：

<ion-content class="home">
  <ion-list>
    <ion-item *ngFor="let oferta of ofertas">
      <h2>{{oferta.companyName}}</h2>
      <pre>{{ oferta.prices.priceList[0] ? oferta.prices.priceList[0] | json }}</pre>
    </ion-item>
  </ion-list>
</ion-content>

【问题讨论】：

感觉你的第一个 json 结构是一个数组，而价格只存在于数组的第二项中。这些项目是对象，但第一个分支是一个数组：所以，ofera[1].prices.priceList ... 使用 jsonblob 或任何编辑器，我认为你没有看到正确的 json 结构并且有你的错误......
是的，对不起，oferta[0]，你是对的。你能帮我得到“priceList”元素中的第一项吗？它抛出一个未定义的错误
oferta.prices.priceList[0].firstBill
如果不需要显示每个ofertas项目的所有oferta.prices.priceList，如何使用*ngIf<pre *ngIf="oferta.prices.priceList"> here put another *ngFor iterate through oferta.prices.priceList so you access all firstbill</pre>
我不确定他是想访问所有第一个账单值还是只访问第一个。我写的内容将按照您在评论中的要求为您提供第一个...无论如何将代码粘贴到 json blob 或查看此类示例，您会弄清楚stackoverflow.com/questions/18436084/…

标签： javascript angularjs json ionic-framework

【解决方案1】：

试试下面修改后的代码。可能这可以帮助你。我添加了带有一些嵌套 div 结构的 ngIf。

 <ion-list>
          <ion-item *ngFor="#oferta of ofertas">
            <h2>{{oferta.companyName}}</h2>
                  <div *ngIf="oferta.prices">
                   <div *ngFor="#plist of oferta.prices.priceList">
                          <pre>{{ plist | json }}</pre>
                  </div>
            </div>
          </ion-item>
       </ion-list>


 this.ofertas = [{
        "companyName": "Madrid",
        "producCompanyId": 4,
        "productCompanyName": "Empresa1",
        "state": {
            "id": 5,
            "description": "Completada sin precios"
          },

          "message": "\nHay otra empresa igual en ACTIVO                                              "
      }, {
          "companyName": "Barcelona",
          "producCompanyId": 10,
          "productCompanyName": "Empresa2",
          "companyResultId": "889",
          "state": {
              "id": 4,
              "description": "Completada con precios"
          },
          "prices": {
              "priceList": [{
                  "priceId": 699614,
                  "companyPriceId": "1091931204",
                  "firstBill": 281.96,
                  "issuable": true
              }, {
                  "priceId": 699609,
                  "companyPriceId": "1091931204",
                  "firstBill": 251.64,
                  "issuable": true
              }, {
                  "priceId": 699611,
                  "companyPriceId": "1091931204",
                  "firstBill": 302.6,
                  "issuable": true
              }]
          },
          "message": ""
      }]

【讨论】：