我使用 ng-repeat 循环遍历我想要打印编号标题的对象数组。
例如:
Controller
var cars = [
{make:'ford',model:'mustang'},
{make:'ford',model:'fusion'},
{make:'bwm',model:'x5'},
{make:'honda',model:'civic'},
{make:'honda',model:'accord'},
{make:'toyota',model:'camry'},
{make:'honda',model:'crv'},
];
查看
<div ng-repeat="car in cars" ng-show="car.make=='ford'">
<h1>Fords:</h1>
<div><b>{{$index}})</b> {{car.model}}</div>
</div>
<div ng-repeat="car in cars" ng-show="car.make=='honda'">
<h1>Hondas:</h1>
<div><b>{{$index}})</b> {{car.model}}</div>
</div>
预期输出
Fords:
0) mustang
1) fusion
Hondas:
0) civic
1) accord
2) crv
实际输出
Fords:
0) mustang
1) fusion
Hondas:
3) civic
4) accord
6) crv
换句话说，在每个循环中 $index 维护对源数组的引用。我认为这是有道理的，但我认为 $index 的目的是计算给定循环范围内的迭代次数？
如何使用 $index (或其他东西)来实现我的预期输出？
最佳答案
一个简单的解决方案是创建一个过滤数组，该数组仅返回匹配的元素。然后您可以正确使用 $index 来打印订购号。
<body ng-app="textInputExample">
<script>
angular.module('textInputExample', [])
.controller('ExampleController', ['$scope', function($scope) {
var cars = [{
make: 'ford',
model: 'mustang'
}, {
make: 'ford',
model: 'fusion'
}, {
make: 'bwm',
model: 'x5'
}, {
make: 'honda',
model: 'civic'
}, {
make: 'honda',
model: 'accord'
}, {
make: 'toyota',
model: 'camry'
}, {
make: 'honda',
model: 'crv'
}, ];
$scope.cars = cars;
$scope.filteredcars = function(make){
return $scope.cars.filter(function(e) { return e.make === make });
};
}]);
</script>
<div ng-controller="ExampleController">
<div ng-repeat="car in filteredcars('honda')">
<h1>Hondas:</h1>
<div><b>{{$index}})</b> {{car.model}}</div>
</div>
</div>
</body>
关于javascript - Angular ng-repeat - 跨多个循环的唯一 $index，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42172167/