CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
Josue Espinosa
Josue Espinosa

Reputation: 5089

ng-repeat on array of objects not working..?

I have an array of objects like this:

var data = [{
    "id": 1,
    "age": 20,
    "name": "Janell Mcintosh",
    "gender": "female",
    "email": "[email protected]",
    "phone": "+1 (906) 555-2575"
  },etc..
];
var keys = Object.keys(data[0]);

I am trying to display this data in a table. The keys are columns, and all of the object's values are supposed to go in the relevant column. Here is what I am trying:

<table class="table table-striped">
    <tr>
        <th ng-repeat="key in keys">
            {{key}}
        </th>
    </tr>

    <tr ng-repeat="row in data">
        <td ng-repeat="key in keys">
            {{row['"'+key+'"']}}
        </td>
    </tr>
</table>

This doesn't work. I am trying to put quotes around the key because the JSON I receive has the keys and values in quotes. The data/variables are stored properly, I just don't know how to access them.

Am I doing something incorrectly here?

{{row['"'+key+'"']}}

I'm just trying to add quotes to the key.

View sample plunker here:

Upvotes: 1

Views: 889

Answers (1)

McGarnagle
McGarnagle

Reputation: 102723

You don't need the double-quotes around the key values. (Javascript parses keys the same whether or not the quotes are present, so var data = { "id": 1 } is completely equivalent to var data = { id: 1 }.

So all you need is:

<td ng-repeat="key in keys">
    {{row[key]}}
</td>

See here.

Upvotes: 2

Related Questions