如何在Angular中打印JSON的主键值?

时间:2016-02-17 18:46:47

标签: angularjs json

下面是我正在使用的类似样式的数组。我需要打印产品名称(即Product1名称,Product2名称,Product3名称)。如何实现

{
    'Product1 name':[{
        price: '20',
        color:'red'
    }],
    'Product2 name':[{
        price: '30',
        color:'green'
    }],
        'Product3 name':[{
        price: '40',
        color:'blue'
    }]
}

3 个答案:

答案 0 :(得分:1)

假设$scope.products = { 'Product1 name':[{ price: '20', color:'red' }], 'Product2 name':[{ price: '30', color:'green' }], 'Product3 name':[{ price: '40', color:'blue' }] } -

您的观点应该是这样的:

<div ng-repeat="(key,val) in products">{{ key }}</div>

答案 1 :(得分:0)

您可以使用Object.keys创建新的产品名称数组

<强>的JavaScript

$scope.products = {
  'Product1 name':[{
    price: '20',
    color:'red'
  }],
  'Product2 name':[{
    price: '30',
    color:'green'
  }],
    'Product3 name':[{
    price: '40',
    color:'blue'
  }]
};

$scope.productNames = Object.keys($scope.products);

查看

<div ng-repeat="name in productNames">{{name}}</div>

答案 2 :(得分:0)

//角度代码

<ul  *ngFor = "let data of  allDataFromAws | async " >

<--- Data is printing in a key-value format without double quotes
    <li *ngFor = "let child of data | keyvalue">
        {{child.key}} : <strong>{{child.value}}</strong>
    </li>

<--- Data in JSON format --->

   {{data |json}}

</ul>