Angular 4 - ngFor не перерисовывает весь DOM

Question

Я просто проверяю параметр trackBy для *ngFor.В большинстве примеров, доступных в Интернете, это показывает, что если вы не используете опцию trackBy по умолчанию, она перерисовывает весь DOM.Например, если у нас есть таблица и 3 строки, сгенерированные с помощью ngFor, после добавления другой строки в консоли вы увидите, что все 4 строки регенерированы.Если вы используете trackBy, он будет отображать только 4-ю строку, а предыдущие 3 строки останутся без изменений.

Но здесь возникает запутанная часть.Я попытался воспроизвести пример со строками таблицы с Angular 4, и когда я пытаюсь добавить новую строку с помощью ngFor (без использования trackBy), он волшебным образом не переопределяет весь DOM для меня, но точно повторяет-представляет только последний ряд.Если я добавлю функцию trackBy, она не изменит способ визуализации DOM.

Просто интересно, обновили ли они его в какой-то момент времени, и теперь ngFor более эффективен, или я что-то упустил?

Пример кода: https://stackblitz.com/edit/angular-igjyci?file=src%2Fapp%2Fapp.component.html

Пример GIF: GIF в действии

Answer 1

Если вы только добавите новый элемент в массив, дом не изменится, потому что идентичности предыдущих элементов остаются прежними.Только например, если вы переделаете весь массив (даже с теми же значениями), DOM изменится.TrackBy просто добавляет возможность идентифицировать объект другим методом.Посмотрите ссылку ниже для полного объяснения.

https://angular.io/api/common/NgForOf#change-propagation