CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
jwimmer
jwimmer

Reputation: 209

Angular ng-Repeat on Table

I refuse to believe that this is the only way to get what I want. If so this defeats the ease of the ng-repeat. I am pulling from a JSON string and I want to build a simple table. Here is what I have and it works, but I don't think its the proper way. I have tried {{e.POST_TITLE}} and no luck. How should I be doing this? 

<table class="table table-striped table-bordered">
<thead>
<th><input type="text" class="" value="" placeholder="Tag Name"></th>
<th></th>
</thead>

<tbody>
<tr ng-repeat="e in Posts">
<td>{{Posts.POST_TITLE[$index]}} </td>
<td>{{Posts.TAGS[$index]}}</td>

</tr>



</tbody>


</table>

Here is a sample of the JSON:

enter image description here

Upvotes: 0

Views: 1720

Answers (1)

callmekatootie
callmekatootie

Reputation: 11238

Your model is incorrect. What you have are multiple arrays and each element of the array at the same array index are related to each other - that is they need to be logically grouped and there need to be 22 Arrays of each record, not 22 Arrays of each column, if that makes sense.

You have two choices:

Choice 1
Correct your model. Using an example here, this is how your model looks like currently:

Item = ["Item1", "Item2", "Item3];
Fruit = ["Apple", "Orange", "Watermelon"];

Instead, your model should look like:

Records = [
    {
        Item: "Item1",
        Fruit: "Apple"
    },
    {
        Item: "Item2",
        Fruit: "Orange"
    },
    {
        Item: "Item3",
        Fruit: "Watermelon"
    }
];

Choice 2
What you have been doing. That is not recommended since your model can be improved with Choice 1 but if you still wish to go ahead, then you can indeed proceed with the code that you have written. It does work - the issue could be that you have forgotten to JSON.parse() the data that is returned.

Upvotes: 1

Related Questions