在数组中使用切片不会影响模板答案

【问题标题】：using slice in an array doesn't affect the template在数组中使用切片不会影响模板
【发布时间】：2018-10-16 20:56:14
【问题描述】：

我有一个数组 availableBoats，我正在使用以下代码 sn-p 渲染它的元素：

<app-boat *ngFor="let b of availableBoats" [size]="b.size" [(available)]="b.available" [type]="b.type" ></app-boat>

我期待当我使用.slice() 函数从阵列中删除一艘船时，它不会再出现在模板中。我做错了什么还是这不是 Angular 中的预期行为？

在某些时候，会调用以下代码。我测试了它在那里设置了一个断点，我可以看到船被移除了：

for (let i = 0; i < this.availableBoats.length; i++) {
  const b = this.availableBoats[i];
  if (b.type === this.selectedBoatType) {   
    this.availableBoats.slice(i, 1);
    return;
  }
}

【问题讨论】：

我们不知道，因为您没有发布代码。但是 slice 不会从数组中删除元素。仔细阅读其文档：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
^^^ 他说了什么。

标签： javascript angular angular5

【解决方案1】：

我期待当我使用 .slice() 函数，它不会再出现在模板中。

您的假设不正确，因为slice

(...) 将数组的一部分的浅拷贝返回到新数组中从头到尾选择的对象（不包括结尾）。 原创数组不会被修改。

为了改变数组，您需要使用 splice which

(...) 通过删除现有元素来更改数组的内容 和/或添加新元素

因此this.availableBoats.slice(i, 1); 不会从this.availableBoats 中删除任何元素。

为此，请使用this.availableBoats.splice(i, 1);

【讨论】：