如何在ng-repeat中使用嵌套JSON中的键值对

时间:2015-06-18 10:13:59

标签: javascript json angularjs

我正在尝试使用angular在JSON中打印获取的数据。 JSON是

"products": { "65": { "5": { "id": 5, "product_id": 1, "client_id": 96, "ticket_id": 65, "sold_by": 6, "product_price": 13000, "sold_from_date": 1434459600, "sold_to_date": 1444741200 }, 如何在前端重复此操作以显示此数据?

我尝试了这个,但它没有用。

    <div ng-repeat="(product_id, product1) in acct_details.products">
                    <div ng-repeat="(product_id2, product2) in product1">
                        <tr ng-repeat="product in product2">
                            <td> <input class="chkbox-style" type="checkbox"></input>
                                 <p class="para-inline">{{product.product_name}}</p>
                            </td>
                            <td>
                                {{product.product_price | currency:"&#8377;"}}
                            </td>
                            <td>
                                {{product.sold_from_date *1000| date: 'mediumDate'}}
                            </td>
                            <td> 
                                {{product.sold_to_date *1000| date:'mediumDate'}}
                            </td>
                        </tr>
                    </div>
                    </div>****

2 个答案:

答案 0 :(得分:3)

首先,您的JSON应该得到改进。 JSON本身应该足以理解所表示的内容,在这种情况下不会。我的JSON版本:

"products": {
    "product": {
        "ticket_id": 65,
        "id": 5,
        "details": {
                "product_id": 1,
                "client_id": 96,
                "sold_by": 6,
                "product_price": 13000,
                "sold_from_date": 1434459600,
                "sold_to_date": 1444741200
        }
    }
}

我假设65ticket_id相关,而5id相对应。 因此,我能够在我的HTML中使用适当的数据JSON表示:

<div ng-repeat="product in products">
    {{product.ticket_id}}-{{product.id}}
    <div ng-repeat="(key,value) in product.details">
        {{key}}:{{value}}
    </div>
</div>

保持JSON整齐的结构将始终使您的编码更容易。

答案 1 :(得分:0)

我认为产品1是:

           {
            "5": {
                "id": 5,
                "product_id": 1,
                "client_id": 96,
                "ticket_id": 65,
                "sold_by": 6,
                "product_price": 13000,
                "sold_from_date": 1434459600,
                "sold_to_date": 1444741200
            }

然后product2是:

{
                "id": 5,
                "product_id": 1,
                "client_id": 96,
                "ticket_id": 65,
                "sold_by": 6,
                "product_price": 13000,
                "sold_from_date": 1434459600,
                "sold_to_date": 1444741200
            }

所以你不需要第三次重复。只需致电product2.product_price或其他任何需要的东西。