Question

如何使用ng-repeat从JSON显示特定数量的项目。现在它只显示最后一项。

JSON

{  
   "list":{  
        "item": {
            "id":1,
            "img": "1.jpg",
            "user": "David Belle",
            "text": "Cum sociis natoque penatibus et magnis dis parturient montes"
        },
        "item": {
            "id":2,
            "img": "2.jpg",
            "user": "Jonathan Morris",
            "text": "Nunc quis diam diamurabitur at dolor elementum, dictum turpis vel"
        },
        "item": {
            "id":3,
            "img": "3.jpg",
            "user": "Fredric Mitchell Jr",
            "text": "Phasellus a ante et est ornare accumsan at vel magnauis blandit turpis at augue ultricies"
        }
    }
}

ANGULARJS

控制器的

app.controller('mainCtrl', ['$scope', '$resource', function($scope, $resource) {
    $scope.msAPI = $resource("data/messages-notifications.json");
    $scope.msResult = $scope.msAPI.get();
}]);

HTML

<div ng-controller="mainCtrl">
    <a href="" ng-repeat="w in msResult.list">
         <div class="lv-title">{{ w.user }}</div>
         <small class="lv-small">{{ w.text }}</small>
    </a>
</div>

Answer 1

最简单的方法是将JSON结构更改为包含数组（而不是对象），如下所示：

{  
   "list": [{
        "id":1,
        "img": "1.jpg",
        "user": "David Belle",
        "text": "Cum sociis natoque penatibus et magnis dis parturient montes"
    }, {
        "id":2,
        "img": "2.jpg",
        "user": "Jonathan Morris",
        "text": "Nunc quis diam diamurabitur at dolor elementum, dictum turpis vel"
    }, {
        "id":3,
        "img": "3.jpg",
        "user": "Fredric Mitchell Jr",
        "text": "Phasellus a ante et est ornare accumsan at vel magnauis blandit turpis at augue ultricies"
    }]
}

ng-repeat仅显示json中的最后一项

1 个答案: