Reputation: 2021
In my index.html file we use two ng-repeat file to get data from data.json .
In this approach each data created repeated DOM.
How to use single ng-repeat instead of double ng-repeat in my index.html .
<div ng-repeat="x in userdata">
<item data="y" ng-repeat="y in x.content"></item>
</div>
https://plnkr.co/edit/uGRmYSv90kbjFzx9qmkI?p=preview
Upvotes: 1
Views: 577
Reputation: 1092
create a map with the contents and add as another object to the documents
var createMap = function(list) {
var map = {};
for(var i =0;i <list.length ; i++) {
map[list[i].name] = list[i].content;
}
return map;
};
Database.getDatabase().success(function(data){
for(var i =0;i <data.document.length ; i++) {
data.document[i]['userdata'] = createMap(data.document[i].content);
}
$scope.userdata=data.document;
console.log($scope.userdata);
}).error(function(){
});
Upvotes: 0
Reputation: 2265
Instead of doing $scope.userdata = data.document
you could do:
$scope.userdata = data.document.reduce(function(a, b) {
return a.concat(b.content);
}, []);
This will place all the content
in the same array. and use it exactly how you have commented in your plunker
<item data="x" ng-repeat="x in userdata"></item>
Here's an update on your plnkr
Upvotes: 0
Reputation: 2075
you can use nested angular for each in js,so u can use single ng-repeat using final scope
Database.getDatabase().success(function(data){
$scope.userdata=data.document;
$scope.sample = [];
angular.forEach($scope.userdata, function(content) {
angular.forEach(content.content, function(content) {
$scope.sample.push(content);
})
})
}).error(function(){
});
now u can loop with sample as
<div ng-repeat="x in sample">
{{x.content}}
</div>
Upvotes: 1