Angularjs中ng-repeat的简单实例
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的使用实例，如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
-
本文向大家介绍AngularJS基础 ng-repeat 指令简单示例，包括了AngularJS基础 ng-repeat 指令简单示例的使用技巧和注意事项，需要的朋友参考一下 AngularJS ng-repeat 指令 AngularJS 实例 循环输出多个标题: 定义和用法 ng-repeat 指令用于循环输出指定次数的 HTML 元素。 集合必须是数组或对象。 语法 <element ng-
-
本文向大家介绍Angularjs中ng-repeat-start与ng-repeat-end的用法实例介绍，包括了Angularjs中ng-repeat-start与ng-repeat-end的用法实例介绍的使用技巧和注意事项，需要的朋友参考一下 ng-repeat-start与ng-repeat-end时AngularJS（1.2.x）扩展的，使用这两个指令可以灵活控制遍历形式。 例如： ind
-
问题内容： 嗨，我有一个简单的ng-repeat-start和end用例，并且工作正常，当我想添加一个内部ng-repeat时出现了问题。这是我的代码 内部ng-repeat到td元素中不起作用，在检查html源代码时看到ngRepeat注释，但未创建td元素。 我的丑陋的解决方法（假设我知道该向量的大小）是： 问题答案： 从那时起，我不确定是否使用角度1.1.6，并且在1.1.5或1.0.7
-
问题内容： 如何在ng-repeat中使用动态名称命名表单？ 我想动态命名每种形式。例如，将$ index添加到表单名称。我该如何实现？我在ng-repeat上尝试了ng-init，但是没有用。 问题答案： 您可以这样做： 编辑 ： 您也可以使用，如下所示： 如果仅基于表单的有效性应用类，则可以将样式应用于自动添加的类，例如：
-
本文向大家介绍AngularJS ng-controller 指令简单实例，包括了AngularJS ng-controller 指令简单实例的使用技巧和注意事项，需要的朋友参考一下 AngularJS ng-controller 指令 AngularJS 实例 为应用变量添加控制器: 运行结果： Full Name: John Doe 该实例演示了如何定义一个控制器及 scope 的使用。 定义
-
问题内容： 如果我的措词不正确，我事先表示歉意。我在的内部有一个文本框，当我尝试获取文本框值时始终为。我只希望它显示我在相应文本框中键入的内容。 似乎是一个问题，那么我该如何创建全局或控制器根级别以便可以访问它？ 这是帮助解决问题的JSFiddle：http : //jsfiddle.net/stevenng/9mx9B/14/ 问题答案： 在您的点击表达式中，您可以引用并在您的函数中对其进行访问