Angularjs中ng-repeat的簡單實例
創(chuàng)新互聯(lián)公司成立與2013年,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項目網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計網(wǎng)站策劃,項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命,1280元汝城做網(wǎng)站,已為上家服務(wù),為汝城各地企業(yè)和個人服務(wù),聯(lián)系電話:028-86922220
第一個例子:使用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>學(xué)號</th> <th>姓名</th> <th>分數(shù)</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>學(xué)號</th> <th>姓名</th> <th>分數(shù)</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的使用實例,如有疑問請留言或者到本站社區(qū)交流討論,感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
分享名稱:Angularjs中ng-repeat的簡單實例
瀏覽路徑:http://muchs.cn/article36/jcposg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站收錄、微信公眾號、云服務(wù)器、軟件開發(fā)、面包屑導(dǎo)航、App設(shè)計
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)