CODEWITHSUNDEEP
angularjs
Ketan Joshi Muntazeer
Ketan Joshi Muntazeer

Reputation: 11

Unable to display data using AngularJS ng-repeat with table.

i am trying to display data in a table using angularJS ng-repeat. Data is not displayed. Here is my code : https://jsfiddle.net/807mxydL/. Thanks for your help

var custApp = angular.module('custApp', []);

var custApp = angular.module('custApp', []);

custApp.controller('CustomerController',function($http){

   this.nm = 1;

this.custs = 

[{"custid":"1","custLnm":"Joshi","custFnm":"Amod","custCellno":"9970983214","custImgPath":"1.jpg"},{"custid":"2","custLnm":"Khare","custFnm":"Aditya","custCellno":"9860178001","custImgPath":"2.jpg"},{"custid":"3","custLnm":"Bhosale","custFnm":"Ketan","custCellno":"9890567713","custImgPath":"3.jpg"},{"custid":"4","custLnm":"Joshi","custFnm":"Rohit","custCellno":"9850703451","custImgPath":"4.jpg"},{"custid":"5","custLnm":"Bhat","custFnm":"Vidyut","custCellno":"9767211811","custImgPath":"5.jpg"},{"custid":"6","custLnm":"Chhadwa","custFnm":"Viraj","custCellno":"9767676767","custImgPath":"6.jpg"}
];

};

};

HTML code: 

<div ng-app="custApp">
  <div ng-controller="CustomerControlleras customer">
        {{customer.nm}}
        <table>
             <tr>
               <td> id </td>
               <td> lnm </td>
               <td> fnm </td>
               <td> cell </td>
               <td> img </td>
             </tr>
             <tr ng-repeat="c in customer.custs">
               <td>{{c.custid}}</td>
               <td>{{c.custLnm}}</td>
               <td>{{c.custFnm}}</td>
               <td>{{c.custCellno}}</td>
               <td>{{c.custImgPath}}</td>
             </tr>
        </table>
  </div>
</div>

Upvotes: 1

Views: 47

Answers (1)

Hadi
Hadi

Reputation: 17299

Try like this

you have some mistakes.

1: <div ng-controller="CustomerController as customer">

2:forgot put ) in end of controller

var custApp = angular.module('custApp', []);
custApp.controller('CustomerController',function($http){
   this.nm = 1;
   this.custs = [{"custid":"1","custLnm":"Joshi","custFnm":"Amod","custCellno":"9970983214","custImgPath":"1.jpg"},{"custid":"2","custLnm":"Khare","custFnm":"Aditya","custCellno":"9860178001","custImgPath":"2.jpg"},{"custid":"3","custLnm":"Bhosale","custFnm":"Ketan","custCellno":"9890567713","custImgPath":"3.jpg"},{"custid":"4","custLnm":"Joshi","custFnm":"Rohit","custCellno":"9850703451","custImgPath":"4.jpg"},{"custid":"5","custLnm":"Bhat","custFnm":"Vidyut","custCellno":"9767211811","custImgPath":"5.jpg"},{"custid":"6","custLnm":"Chhadwa","custFnm":"Viraj","custCellno":"9767676767","custImgPath":"6.jpg"}
];

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="custApp">
  <div ng-controller="CustomerController as customer">
        {{customer.nm}}
        <table>
             <tr>
               <td> id </td>
               <td> lnm </td>
               <td> fnm </td>
               <td> cell </td>
               <td> img </td>
             </tr>
             <tr ng-repeat="c in customer.custs">
               <td>{{c.custid}}</td>
               <td>{{c.custLnm}}</td>
               <td>{{c.custFnm}}</td>
               <td>{{c.custCellno}}</td>
               <td>{{c.custImgPath}}</td>
             </tr>
        </table>
  </div>
</div>

Upvotes: 1

Related Questions