Joh*_*n23 7 arrays angularjs ng-repeat
所以我只是从角度JS开始,在处理数组时对ng-repeat有点困惑.下面的代码不能正常工作......但是当我将dayNames更改为一个对象并给它键值对时,它没问题.
var myApp = angular.module('exampleApp', []);
myApp.controller("dayCtrl",function($scope){
$scope.dayNames = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "sunday", "monday", "tuesday", "wednesday", "thursday", "friday"];
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="exampleApp">
<head>
<script src="angular.js"></script>
<script src="controller.js"></script>
</head>
<body ng-controller="dayCtrl">
<h2>Hello, these are the days of the week</h2>
<ul>
<li ng-repeat="day in dayNames">{{day}}</li>
</ul>
</body>
</html>PSL*_*PSL 17
它不能正常工作,因为您在数组中有重复项.重复基元数组时,angular用于将数组中的项与DOM元素相关联的默认唯一键是数组本身中的项.在您的情况下,它不是唯一的,它会导致转发器错误重复.
您也可以通过使用来避免这种情况track by $index,这使得索引成为标识符.
ng-repeat="day in dayNames track by $index"
当您使用对象数组(没有跟踪)时,angular会将唯一ID添加到$$hashkey在数组的每个项目上调用的新属性.然后,此属性用作关联DOM元素与按标识的数组中相应项的关键字.在数组中移动相同的对象将以相同的方式在DOM中移动DOM元素.因此,当您使用对象数组时,您看不到任何问题,因为所有这些hashkey都是唯一的.
var myApp = angular.module('exampleApp', []);
myApp.controller("dayCtrl",function($scope){
$scope.dayNames = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "sunday", "monday", "tuesday", "wednesday", "thursday", "friday"];
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="exampleApp">
<head>
<script src="angular.js"></script>
<script src="controller.js"></script>
</head>
<body ng-controller="dayCtrl">
<h2>Hello, these are the days of the week</h2>
<ul>
<li ng-repeat="day in dayNames track by $index">{{day}}</li>
</ul>
</body>
</html>