Angularjs中ng-repeat的簡單實例
第一個例子:使用ng-repeat最簡單的例子
<html ng-app="myApp"><head><title>angularjs-demo</title><script type="text/javascript" src="angular.min.js" charset="utf-8"></script></head><body ng-controller="ctrl"><table width="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <th>學號</th> <th>姓名</th> <th>分數</th> </tr> <tr ng-repeat="item in items"> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.score}}</td> </tr></table><script> var app = angular.module('myApp',[]); app.controller("ctrl",function($scope,$location){ $scope.items = getStu(); }); function getStu() { return [{id:1010,name:'張三',score:50},{id:1011,name:'李四',score:60},{id:1012,name:'王五',score:80}]; } </script></body></html>
第二個例子:添加過濾條件
<html ng-app="myApp"><head><title>angularjs-demo</title><script type="text/javascript" src="angular.min.js" charset="utf-8"></script></head><body ng-controller="ctrl"><table width="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <th>學號</th> <th>姓名</th> <th>分數</th> </tr> <tr ng-repeat="item in items | filter:fscore"> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.score}}</td> </tr></table><script> var app = angular.module('myApp',[]); app.controller("ctrl",function($scope,$location){ $scope.items = getStu(); $scope.fscore = function(e) { return e.score>=60; } }); function getStu() { return [{id:1010,name:'張三',score:50},{id:1011,name:'李四',score:60},{id:1012,name:'王五',score:80}]; } </script></body></html>
以上就是AngularJs 中ng-repent的使用實例,如有疑問請留言或者到本站社區交流討論,感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
新聞熱點
疑難解答