CODEWITHSUNDEEP
javascriptangularjs
iJade
iJade

Reputation: 23791

Making Nested ng-repeat in AngularJS dynamic

I'm trying to implement a table using ng-repeat for the following data :

    [{
    "Name": "Alfreds Futterkiste",
    "City": "Berlin",
    "Country": "Germany"
}, {
    "Name": "Berglunds snabbköp",
    "City": "Luleå",
    "Country": "Sweden"
}]

Here is my AngularJS code :

<table>
    <tr ng-repeat="d in stuff">
        <td>
            {{d.Name}}    
        </td>
        <td>
            {{d.Country}}
        </td>
        <td>
            {{d.City}}
        </td>
    </tr>
</table>

The above code works fine but the number of td has been hard coded. Is there any way to make it dynamic.

Upvotes: 0

Views: 245

Answers (1)

Simon Staton
Simon Staton

Reputation: 4505

Add a second ng-repeat to your table:

<table>
    <tr ng-repeat="d in stuff">
        <td ng-repeat="(key, value) in d">
            {{value}}    
        </td>
    </tr>
</table>

Its worth noting this will only be valid markup if all results in d are equal in length.

Upvotes: 2

Related Questions