<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/angular.min.js"></script>
</head>
<body>
<!--
key 代表索引 value代表值
$first 第一个
$last 最后一个
$middle 中间
$even:偶数
track by $index ngRepeat不允许collection中存在两个相同Id的对象,$index以索引为依据进行遍历,避免相同items引起的错误
-->
<div ng-app="hd" id="" ng-controller="ctrl">
<ul>
<li ng-repeat="(k,v) in data track by $index">
<sapn ng-if="$first" style="color:red">{{k}} 名称:{{v.name}} 网址:{{v.url}}</sapn>
<span ng-if="$middle">{{k}} 名称:{{v.name}} 网址:{{v.url}}</span>
<span ng-if="$last" style="color: blue;">{{k}} 名称:{{v.name}} 网址:{{v.url}}</span>
</li>
</ul>
</div>
<script>
var m = angular.module("hd", []);
m.controller("ctrl", ["$scope", function($scope) {
$scope.data = [{
name: '百度',
url: 'http://baidu.com'
}, {
name: '腾讯',
url: 'http://qq.com'
},{
name:"新浪",
url:"http://sina.com"
}];
}]);
</script>
</body>
</html>
angularjs之循环遍历
最新推荐文章于 2021-09-08 13:47:01 发布