gpt4 book ai didi

javascript - angularjs 二维数组 ng-repeat 无法正常工作

转载 作者:行者123 更新时间:2023-11-30 07:24:36 24 4
gpt4 key购买 nike

我在 Controller 中定义了一个二维数组,但是当我尝试在它上面循环时,有 2 个叠层循环,它无法按预期工作。第一个循环工作正常,但第二个循环不工作。

js/index.js

var gameOfLifeApp = angular.module('gameOfLifeApp', []);

gameOfLifeApp.controller('fieldCtrl', function ($scope) {
$scope.field = [
[0, 0, 0],
[0, 0, 0],
[0, 0, 0]
];
});

index.html

<!DOCTYPE HTML>
<html ng-app="gameOfLifeApp">
<head>

<meta charset="UTF-8">
<title>Game of Life</title>
<link rel="stylesheet" href="css/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script src="js/index.js"></script>

</head>
<body ng-controller="fieldCtrl">

<div id="field">
<div class="column" ng-repeat="column in field">
<div class="cell" ng-repeat="cell in column"></div>
</div>
</div>

</body>
</html>

输出:

<body ng-controller="fieldCtrl" class="ng-scope">
<div id="field">
<!-- ngRepeat: column in field -->
<div class="column ng-scope" ng-repeat="column in field">
<!-- ngRepeat: cell in column -->
</div>
<!-- end ngRepeat: column in field -->
<div class="column ng-scope" ng-repeat="column in field">
<!-- ngRepeat: cell in column -->
</div>
<!-- end ngRepeat: column in field -->
<div class="column ng-scope" ng-repeat="column in field">
<!-- ngRepeat: cell in column -->
</div>
<!-- end ngRepeat: column in field -->
</div>
</body>

我做错了什么?

最佳答案

你不能使用这个。如果每个单元格不是对象相同的,Angular 就无法跟踪它们。要克服此问题,请使用 track by 关键字并使用 $index 进行跟踪。

<div id="field">
<div class="column" ng-repeat="column in field">
<div class="cell" ng-repeat="cell in column track by $index"></div>
</div>
</div>

关于javascript - angularjs 二维数组 ng-repeat 无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21901407/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com