ng-repeat-start與ng-repeat-end時AngularJS(1.2.x)擴展的,使用這兩個指令可以靈活控制遍歷形式。
例如:
index.html
<div class="uk-panel" ng-controller="UserCtrl"> <ul class="uk-list uk-list-striped"> <li ng-repeat-start="user in users"> {{user.name}} </li> <li ng-repeat-end> {{user.email}} </li> </ul> </div>index.js
var myApp = angular.module('myApp', []);myApp.controller('UserCtrl', ['$scope', function($scope){ $scope.users = [ { name:'張三', email:'zhangsan@gmail.com' }, { name:'李四', email:'lisi@123.com' }, { name:'王五', email:'wangwu@qq.com' } ]; }]);運行結果:

完整的實例代碼
<!DOCTYPE html><html lang="zh-CN" ng-app="app"><head> <meta charset="utf-8"> <title>ng-repeat-start 與 ng-repeat-end的用法</title> <link rel="stylesheet" href="../bootstrap.min.css"></head><body> <h4>多行遍歷的實現方式</h4> <ul ng-controller="PeopleController"> <li ng-repeat-start="person in people"> {{ person.name }} </li> <li>住在</li> <li> {{ person.city }} </li> <br ng-repeat-end> </ul> <script src="../angular.min.js"></script> <script> angular.module('app', []) .controller('PeopleController', ['$scope', function($scope) { $scope.people = [ {name: '張三', city: '廣東'}, {name: '李四', city: '江西'}, {name: '王五', city: '東北'} ] }]) </script></body></html>總結
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流。
新聞熱點
疑難解答