angularJS table array

Question

I'm using angularJS to create an table. But it didn't works so great atm.. here my problem.

Code:

appGenerator.controller('customersCtrl', function ($scope) {
     $scope.names = [
        {"Name": "EMAIL", "StringValue": "dsa@dsada", "Type": "C"},
        {"Name": "DESC", "StringValue": "Test","Type": "C"}
        ];
});

HTML:

 <table class="table">
            <tr ng-repeat="tableItem in names">
                <td ng-repeat="item in tableItem">{{item}}</td>
            </tr>
        </table>

At the moment I get the whole Item. But I want the the "StringValue". I tested <td ng-repeat="item in tableItem">{{item.StringValue}}</td> But it doesn't works. I don't get any output. What I'm doing wrong?

score 2 · Accepted Answer · answered Oct 30 '15 at 10:41

2

You should do it like the following;

<table class="table">
  <tr ng-repeat="tableItem in names">
    <td>{{ tableItem.name }}</td>
    <td>{{ tableItem.StringValue }}</td>
    <td>{{ tableItem.Type }}</td>
  </tr>
</table>

You already iterated the names. Then you should use the object.

answered Oct 30 '15 at 10:41

Ali BARIN

1,870
19
22

Oh god! Thanks :D so easy ^^ – Erdem Güngör Oct 30 '15 at 10:46
You can even iterate on object `{"key": "value"}` pair, please refer: http://stackoverflow.com/questions/33434003/angularjs-table-array/#answer-33434098 – Kulbhushan Singh Oct 30 '15 at 10:51

score 2 · Answer 2 · edited May 23 '17 at 12:29

2

Your second ng-repeat is on object's {"key": "value"} pair so ng-repeat should be as follows:

<table class="table">
    <tr ng-repeat="tableItem in names">
        <td ng-repeat="(key, value) in tableItem">{{key}}&nbsp;{{value}}</td>
    </tr>
</table>

Please refer: How can I iterate over the keys, value in ng-repeat in angular

edited May 23 '17 at 12:29

Community

1
1

answered Oct 30 '15 at 10:44

Kulbhushan Singh

536
5
18

You can iterate keys and values of the object like that. But what did you with this attribute 'ng-repeat="item in tableItem"'? There is no tableItem data in ngRepeat. So why did you iterate it? You should fix this code. – Ali BARIN Oct 30 '15 at 10:55
{{ value.Name}} with this tag it works. Thanks :) – Erdem Güngör Oct 30 '15 at 10:57

angularJS table array

2 Answers2