использование среза в массиве не влияет на шаблон

Question

У меня есть массив availableBoats, и я отображаю его элементы, используя следующий фрагмент кода:

<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;
  }
}

Answer 1

Я ожидал, что когда я удалю одну лодку из массива с помощью функции .slice (), она больше не будет появляться в шаблоне.

Ваши предположения неверны, поскольку slice

(...) возвращает поверхностную копию части массива в новый объект массива, выбранный от начала до конца (конец не включен). Исходный массив не будет изменен .

Для того, чтобы изменить массив, необходимо использовать splice, который

(...) изменяет содержимое массива , удаляя существующие элементы и / или добавляя новые элементы

Следовательно, this.availableBoats.slice(i, 1); не удаляет какой-либо элемент из this.availableBoats.

Для этого используйте this.availableBoats.splice(i, 1);