为什么它总是在AngularJS中选择第一个TD单元格

Why does it always pick a first TD cell in AngularJS

本文关键字：选择 第一个 TD 单元格 AngularJS 为什么      更新时间：2023-09-26

我是AngularJS的新手，我想做一个小游戏。

I have a table:

<table class="board">
<h1>Table</h1>
<input type="number" ng-model="val"><button ng-click="ctrl.foo(val)">PRESS</button>
    <tr ng-repeat="tr in ctrl.arr">
        <td ng-repeat="td in ctrl.arr" ng-click="ctrl.getIndex(tr, td)">{{ctrl.sign[$parent.$index][$index]}}</td>
    </tr>
</table>

这是这个表格的代码用来标记你点击的单元格:

this.foo = function(size){
        this.arr = [];
        for(var i = 0; i < size; i++){
            this.arr.push(i);
        }
    }
    this.getIndex = function(tr, td){
        this.sign = 'X';
        console.log(tr, td);
    }

有人能解释一下为什么点击任何单元格它总是只标记第一个单元格吗?

错误在哪里?

下面是示例

错误在于您正在分配ctrl。在ctrl中将符号作为变量。Push，但是当您使用HTML代码引用它时，将其视为2d数组。

您在第一列中看到'x'的原因可以通过一个小示例来显示(虽然我不确定为什么，但有人可能能够解释它…我认为这与javascript处理变量的方式有关)

var test = 'x';
console.log(test[0][0]); //shows 'x'
console.log(test[0][1]); // shows undefined
console.log(test[1][1]); // type error
所以在你的代码中，我们可以通过创建一个2d数组来修复它，并使用你现有的插入'x'的方法。我们将调整foo来创建/填充2d数组，push将执行插入操作: 
this.foo = function(size) {
    this.arr = [];
    for (var i = 0; i < size; i++) {
        this.arr.push(i);
        //fill our 2d array
        this.sign.push([]);
        for (var g = 0; g < size; g++) {
           this.sign[i].push(''); 
        }
    }
}
this.push = function(parent, index) {
   this.sign[parent][index] = 'X';
   console.log(parent, index)
}
此时，您还可以将n -repeat上的arr替换为sign。请在这里查看工作界面。
相关文章：