angularjs--ng-repeat
Posted 昱歌
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了angularjs--ng-repeat相关的知识,希望对你有一定的参考价值。
angularjs--ng-repeat
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 6 <title>index</title> 7 <link href="{$Think.const.CSSURL}bootstrap.min.css" rel="stylesheet" type="text/css"/> 8 <script src="{$Think.const.JS}jquery.min.js" type="text/javascript"></script> 9 <script src="{$Think.const.JS}bootstrap.min.js" type="text/javascript"></script> 10 <script src="{$Think.const.JS}angular.min.js" type="text/javascript"></script> 11 <link href="{$Think.const.CSSURL}home/index.css" rel="stylesheet" type="text/css"/> 12 </head> 13 <body ng-app="myapp" ng-controller="myctrl"> 14 <div class="container"> 15 <h1 class="page-header">前端技术方案</h1> 16 <table class="table table-bordered table-hover"> 17 <tr> 18 <th>id</th> 19 <th>name</th> 20 <th>age</th> 21 <th>修改</th> 22 <th>删除</th> 23 </tr> 24 <tr ng-repeat="user in users"> 25 <td>{{user.id}}</td> 26 <td>{{user.name}}</td> 27 <td>{{user.age}}</td> 28 <td><a href="#">修改</a></td> 29 <td><a href="#">删除</a></td> 30 </tr> 31 </table> 32 <img src="{$Think.const.HOMEIMG}/01.png" /> 33 </div> 34 </body> 35 <script> 36 angular.module("myapp",[]).controller("myctrl",function($scope){ 37 $scope.users = [ 38 {"id":"1","name":"tom","age":"10"}, 39 {"id":"2","name":"jack","age":"20"}, 40 {"id":"3","name":"舒克","age":"10"}, 41 {"id":"4","name":"贝塔","age":"10"}, 42 {"id":"5","name":"yii","age":"12"}, 43 {"id":"6","name":"ci","age":"16"}, 44 ]; 45 46 }); 47 </script> 48 </html>
以上是关于angularjs--ng-repeat的主要内容,如果未能解决你的问题,请参考以下文章
AngularJs ng-repeat指令中怎么实现含有自定义指令的动态html
每行两个 div 的 AngularJS ng-repeat 网格
AngularJS - ng-repeat 水平 x 次,然后换行