循环遍历Angular2 / typescript中的JSON

时间:2017-05-20 18:44:52

标签: javascript angular typescript

{
  "data": [
    {
      "type": "product",
      "id": "138e45b2-5321-8d6c-94d0079ac1f6",
      "name": "Hendricks",
      "slug": "hendrick",
      "sku": "fcusdfckss",
      "manage_stock": false,
      "description": "hello",
      "price": [
        {
          "amount": 23,
          "currency": "gbp",
          "includes_tax": true
        }
      ],
      "status": "live",
      "commodity_type": "physical",
      "relationships": {
        "categories": {
          "data": [
            {
              "type": "category",
              "id": "0d9143-4266-b682-2c8cac60afbb"
            }
          ]
        }
      },
      "meta": {
        "display_price": {
          "with_tax": {
            "amount": 23,
            "currency": "GBP",
            "formatted": "0.00"
          },
          "without_tax": {
            "amount": 23,
            "currency": "GBP",
            "formatted": "0.00"
          }
        },
        "stock": {
          "level": 0,
          "availability": "out-stock"
        }
      }
    },
    {
      "type": "product",
      "id": "726b64bd-9f16-9191-ff1b6a4ef23f",
      "name": "Tanquerary",
      "slug": "tanq",
      "sku": "fghjdsm",
      "manage_stock": false,
      "description": "A great gin with citrus notes",
      "price": [
        {
          "amount": 88,
          "currency": "gbp",
          "includes_tax": true
        }
      ],
      "status": "live",
      "commodity_type": "physical",
      "relationships": {
        "categories": {
          "data": [
            {
              "type": "category",
              "id": "0d914d6d-4266-b682-2c8cac60afbb"
            }
          ]
        }
      },
      "meta": {
        "display_price": {
          "with_tax": {
            "amount": 88,
            "currency": "GBP",
            "formatted": "0.00"
          },
          "without_tax": {
            "amount": 88,
            "currency": "GBP",
            "formatted": "0.00"
          }
        },
        "stock": {
          "level": 0,
          "availability": "out-stock"
        }
      }
    },
    {
      "type": "product",
      "id": "74ab6970-ffdd-4dfd-1816e081cd72",
      "name": "Bombay Sapphire",
      "slug": "bombay",
      "sku": "bomsaph193",
      "manage_stock": true,
      "description": "A great gin with floral notes",
      "price": [
        {
          "amount": 1999,
          "currency": "gbp",
          "includes_tax": true
        }
      ],
      "status": "live",
      "commodity_type": "physical",
      "relationships": {
        "categories": {
          "data": [
            {
              "type": "category",
              "id": "46569361-1352-83e6-13477074f952"
            }
          ]
        }
      },
      "meta": {
        "display_price": {
          "with_tax": {
            "amount": 1999,
            "currency": "GBP",
            "formatted": "0.00"
          },
          "without_tax": {
            "amount": 1999,
            "currency": "GBP",
            "formatted": "0.00"
          }
        },
        "stock": {
          "level": 5,
          "availability": "in-stock"
        }
      }
    }
  ],
  "links": {
    "current": "...link...?page[limit]=100&page[offset]=0",
    "first": "...link...",
    "last": null
  },
  "meta": {
    "results": {
      "total": 3,
      "all": 3
    },
    "page": {
      "limit": 100,
      "offset": 0,
      "current": 1,
      "total": 1
    }
  }
}

我需要使用Angular 2显示返回的JSON对象的结果。我正在尝试使用Lodash过滤掉不需要的键值对。

我使用以下方法过滤掉了这些值:

      products.data.forEach(element => {
        var prodr = _.pick(products.data, ['0.name', '0.sku', '0.description', '0.price.0.amount']);
        console.log(prodr);
    });

此代码循环遍历对象但返回相同值的对象,因为我已将它们设置为“0”。我想我需要将它们设置为“i”并添加for函数,但我对javascript和typescript很新,我无法正确使用语法。

1 个答案:

答案 0 :(得分:1)

根据您的示例数据使用forEach时,以下代码应该可以使用

 products.data.forEach(element => {
    let product = {
                name : element.name, 
                sku : element.sku, 
                description : element.description,
                price: element.price[0].amount
                }
    console.log(product);

});