ng-repeat of JSON which have index on it

Question

I have a json like this

  {
    "0": {
        "Order_Id": "100000001",
        "prodct_Status": "Pending",
        "Price": "8.0000",
        "date_created": "Jun 4, 2014 7:55:42 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    },
    "1": {
        "Order_Id": "100000002",
        "prodct_Status": "Pending",
        "Price": "38.4600",
        "date_created": "Jun 7, 2014 6:37:48 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    },
    "2": {
        "Order_Id": "100000003",
        "prodct_Status": "Pending",
        "Price": "44.9200",
        "date_created": "Jun 10, 2014 4:52:46 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    }
}

I wanna do ng repeat in this json . I have those 0 1 index there which i can not remove .

SyntaxError: Unexpected token :message: "Unexpected token :"stack: (...)get stack: function () { [native code] }set stack: function () { [native code] }__proto__: Error — Narek Mamikonyan, Oct 06 '14 at 06:15
You have a object of objects in your example. Maybe it should be an array of objects? It should look like this [{},{},...,{}] — Dr Casper Black, Oct 06 '14 at 06:18
casper i cant edit that json I dont have controll over that . is there any way in this json. and narek json validator validated it — Ashisha Nautiyal, Oct 06 '14 at 06:19
This IS valid JSON. Try jsonlint.org. But @AshishNautiyal: you don't have an index of "1" but a property of `1` and `2` which makes a difference! — Axel Amthor, Oct 06 '14 at 06:21
@AxelAmthor yes . But is there any way to ignore this and use it in ng-repeat or get solution — Ashisha Nautiyal, Oct 06 '14 at 06:23
@AshishNautiyal AFAIK no, you have an Object with Objects but you need an array of Objects, see previous comments — Axel Amthor, Oct 06 '14 at 06:26

score 3 · Answer 1 · answered Oct 06 '14 at 06:27

you can use the standard ng-repeat syntax:

<body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <div ng-repeat="item in data">
      {{item.Order_Id}}
      {{item.Region}}
    </div>
  </body>

controller:

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.data = {
    "0": {
        "Order_Id": "100000001",
        "prodct_Status": "Pending",
        "Price": "8.0000",
        "date_created": "Jun 4, 2014 7:55:42 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    },
    "1": {
        "Order_Id": "100000002",
        "prodct_Status": "Pending",
        "Price": "38.4600",
        "date_created": "Jun 7, 2014 6:37:48 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    },
    "2": {
        "Order_Id": "100000003",
        "prodct_Status": "Pending",
        "Price": "44.9200",
        "date_created": "Jun 10, 2014 4:52:46 AM",
        "Shipping_Address": "vbccv",
        "Region": "Arizona",
        "Country": "US"
    }
   };

});

http://plnkr.co/edit/o7pQvhh2KKL7xgqhtL5L?p=preview

`(key, item) in data` if you want access to the key as well: [(plunker)](http://plnkr.co/edit/spGLFCD1c22Ei4XuuMP4?p=preview) — Jason Goemaat, Oct 06 '14 at 06:54

score 3 · Answer 2 · edited May 23 '17 at 11:58

3

ng-repeat can iterate with objects as well:

<div ng-repeat="(index, order) in {'0':{'Order_Id':'1'},'1':{ 'Order_Id': '2'}}">
  <span>{{ order.Order_Id }}</span>
</div>

In your case string index can be ignored. See also this answer.

edited May 23 '17 at 11:58

Community

1
1

answered Oct 06 '14 at 06:28

Eugene Gluhotorenko

3,094
2
33
52

paka · Answer 3 · 2014-10-06T06:31:38.517

0

Try it like this

var json = { /* your json goes here */ };

<ul>
     <li ng-repeat="(key,value) in json">
      {{key}} {{value.Price}}
     </li>
</ul>

http://plnkr.co/edit/01vry4469ggGs1O1i5tI?p=preview

edited Oct 06 '14 at 06:31

answered Oct 06 '14 at 06:26

paka

1,601
22
35

ng-repeat of JSON which have index on it

3 Answers3