Question

如果我的JSON看起来像

，我该如何使用ng-repeat

[
    {
        "id": "1",
        "shop_name": "Shop Name",
        "user_id": "2",
        "shop_email": "",
        "shop_address": "",
        "shop_phone": "",
        "company_name": "",
        "description": "",
        "shop_provision": null,
        "created_at": "2014-11-05 10:32:32",
        "updated_at": "2014-11-06 21:02:00",
        "banners": [
            {
                "id": "18",
                "disk_name": "545be1dfa2011452107756.png",
                "file_name": "Screenshot from 2014-11-06 09:50:48.png",
                "file_size": "135441",
                "content_type": "image/png",
                "title": null,
                "description": null,
                "field": "banners",
                "sort_order": "18",
                "created_at": "2014-11-06 21:02:23",
                "updated_at": "2014-11-06 21:02:34",
                "path": "/uploads/public/545/be1/dfa/545be1dfa2011452107756.png",
                "extension": "png"
            },
            {
                "id": "20",
                "disk_name": "545be1e6b5048131391528.png",
                "file_name": "Screenshot from 2014-11-06 09:50:48.png",
                "file_size": "135441",
                "content_type": "image/png",
                "title": null,
                "description": null,
                "field": "banners",
                "sort_order": "20",
                "created_at": "2014-11-06 21:02:30",
                "updated_at": "2014-11-06 21:02:34",
                "path": "/uploads/public/545/be1/e6b/545be1e6b5048131391528.png",
                "extension": "png"
            }
        ]
    }
]

我希望再次迭代横幅

在控制器上，我得到一个包含subObject（responseJSON）

的JSON对象或数组

october.controllers['dashboard/wm'] = function ($scope, $request) {

     $scope.banners = $request('onGetBanners'); //the $request is an ajax function
     console.log($scope.banners);  
}

subObject

responseJSON看起来像是firebug控制台中的结果

Object { result="[{"id":"1","shop_name":"...","extension":"png"}]}]"}

从这一切我想要结果=

比我尝试迭代范围，如

<div ng-repeat="banner in banners.responseJSON.result track by $index"></div>

更新

我在控制器中启动范围时改变了方式

october.controllers['publishers/wm'] = function ($scope, $request) {

    $request('onGetBanners', {success: function(data){
        this.success(data).done(function() {
              $scope.response = data.result;
            });
    }})     

}

再次尝试迭代

{% verbatim %}

{{response}} //outputs 
[
    {
        "id": "2",
        "shop_name": "Test Shop",
        "user_id": "1",
        "shop_email": null,
        "shop_address": null,
        "shop_phone": null,
        "company_name": null,
        "description": "",
        "shop_provision": null,
        "created_at": "2014-11-05 11:31:15",
        "updated_at": "2014-11-05 11:31:15",
        "banners": []
    }
]

<div ng-repeat="shop in response track by $index">
     {{ shop.shop_name }} //no data
</div>
{% endverbatim %}

如果我删除track by $index我

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: shop in response, Duplicate key: string:", Duplicate value: "\""

得到它，我永远不会忘记这种痛苦

angular.fromJson(jsondata)

Answer 1

你尝试过这样的事吗？

<强> HTML

<div ng-repeat="shop in responseJson">
    {{shop.id}}
    <div ng-repeat="banner in shop.banners">
        <img ng-src="{{banner.path}}>
    </div>
</div>

见jsFiddle

在嵌套的JSON上使用ng-repeat进行迭代

1 个答案: