Reputation: 11
I have a json data returns from php like this:
[
{
"id": 143,
"sender": "btknctTR",
"title": "Batıkan Bu nedir bu bu ne bu",
"date": "Jun 11, 2016 6:47:21 AM",
"lastupdatedate": "Jun 11, 2016 1:48:54 PM",
"category": "Sorular",
"priority": "Kritik",
"appointedRole": "Moderatör",
"archived": true,
"messages": [
{
"sender": "btknctTR",
"message": "Test message",
"date": "Jun 11, 2016 1:48:30 PM"
},
{
"sender": "btknctTR",
"message": "This i second test message",
"date": "Jun 11, 2016 1:48:54 PM"
}
]
},
{
"id": 198,
"sender": "btknctTR",
"title": "Yeni yeni yeniden",
"date": "Jun 11, 2016 12:53:32 PM",
"lastupdatedate": "Jun 11, 2016 8:18:39 PM",
"category": "Diger",
"priority": "Normal",
"appointedRole": "Moderatör",
"archived": true,
"messages": [
{
"sender": "btknctTR",
"message": "Yeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yenidenYeni yeni yeniden",
"date": "Jun 11, 2016 7:54:41 PM"
},
{
"sender": "DonduranAtes",
"message": "asdasd\r\n",
"date": "Jun 11, 2016 7:54:50 PM"
},
{
"sender": "btknctTR",
"message": "sadasdasdasd",
"date": "Jun 11, 2016 7:55:14 PM"
}
]
},
{
"id": 3810,
"sender": "btkncttr",
"title": "asdasdasdasdas",
"date": "Aug 6, 2016 10:55:36 AM",
"lastupdatedate": "Aug 7, 2016 10:33:19 PM",
"category": "Diger",
"priority": "Normal",
"appointedRole": "Moderatör",
"archived": true,
"messages": [
{
"sender": "btkncttr",
"message": "This is the message",
"date": "Aug 6, 2016 10:57:07 AM"
},
{
"sender": "player",
"message": "This is the message tooo",
"date": "Aug 6, 2016 10:57:07 AM"
}
]
}
]
But I can't find how can ng-repeat theese. When I wrote {{data.sender}} returns error [ngRepeat:dupes] in console.
I need list this values in ticket-list page, this is a support system for users.
Upvotes: 1
Views: 776
Reputation: 944
Try this,
Here is working fiddle.
Also check the Angular version, It should minimum 1.2, since it was introduced in that version.
<div ng-controller="MyCtrl">
<div ng-repeat="data in datas track by $index">
Sender : {{data.sender}}
<br> Messages :<br>
<div ng-repeat="(mindex, mvalue) in data.messages">
{{mindex+1}}. {{mvalue.message}} - {{mvalue.date}}
</div>
<br>
</div>
</div>
Upvotes: 0
Reputation: 1316
Let's assume your object is in the value of the variable $scope.data.
Then you can render this in your html with angular as following:
<div ng-repeat="item in data track by $index">
{{ item.id }}
</div>
Update: Indeed, with this specific error you need track by $index
Upvotes: 0
Reputation: 1107
You are getting [ngRepeat:dupes]
error in console because there are some duplicates in the data.
If you want to loop through all the data and show sender
, You can do something like this
<div ng-repeat="data in jsonData track by $index">{{data.sender}}</div>
$index
keeps track of each object in the array using index of the object in the array.
Upvotes: 0