欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Angularjs中ng-repeat的簡(jiǎn)單實(shí)例

 更新時(shí)間：2017年08月25日 14:23:37   作者：魔豆  
這篇文章主要介紹了Angularjs中ng-repeat的簡(jiǎn)單實(shí)例的相關(guān)資料,這里提供兩個(gè)實(shí)例方法幫助大家徹底掌握這部分內(nèi)容，需要的朋友可以參考下

Angularjs中ng-repeat的簡(jiǎn)單實(shí)例

第一個(gè)例子：使用ng-repeat最簡(jiǎn)單的例子

<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é)號(hào)</th>
  <th>姓名</th>
  <th>分?jǐn)?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>

第二個(gè)例子：添加過(guò)濾條件

<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é)號(hào)</th>
  <th>姓名</th>
  <th>分?jǐn)?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的使用實(shí)例，如有疑問(wèn)請(qǐng)留言或者到本站社區(qū)交流討論，感謝閱讀，希望能幫助到大家，謝謝大家對(duì)本站的支持！

相關(guān)文章

最新評(píng)論