CODEWITHSUNDEEP
angularjs
Pawan
Pawan

Reputation: 32321

Display data properly with Angular JS ng repeat

I am using Angular JS table ng repeat to display values

This is my code 

<div ng-app="myapp" ng-controller="FirstCtrl">
     <table border="1">
  <tr>
    <th ng-repeat="(key, val) in collectioninfo">{{ key }}</th>
  </tr>
<tr ng-repeat="row in collectioninfo">
      <td ng-repeat="(key, val2) in row">
        {{ val2 }}
      </td>
    </tr>
</table>  
</div>

var myapp = angular.module('myapp', []);
myapp.controller('FirstCtrl', function ($scope) {
    $scope.collectioninfo = {
        "SDDD": "Working",
        "RRR": "P",
        "DateCreated": "57:52.2"
    }
});

http://jsfiddle.net/9fR23/501/

Upvotes: 1

Views: 39

Answers (1)

Hadi
Hadi

Reputation: 17289

Try this. collectioninfo is object so you don't need two nested ng-repeat

var myapp = angular.module('myapp', []);
myapp.controller('FirstCtrl', function($scope) {
  $scope.collectioninfo = {
    "SDDD": "Working",
    "RRR": "P",
    "DateCreated": "57:52.2"
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myapp" ng-controller="FirstCtrl">
  <table border="1">
    <tr>
      <th ng-repeat="(key, val) in collectioninfo">{{ key }}</th>
    </tr>
    <tr>
      <td ng-repeat="(key, val2) in collectioninfo">
        {{ val2 }}
      </td>
    </tr>
  </table>
</div>

Upvotes: 3

Related Questions