Столкнулся с таким моментом, не пойму как происходит процесс построения DOM при использовании директивы ng-repeat в совокупности с track by.
Тоесть, вот что я понимаю:
допустим есть у нас объект с данными:
// Defining module
angular.module("notesApp", [])
// Defining controller
.controller("MainCtrl", [function(){
var self = this;
var notes = [
{
id: 1,
label: 'First Note' ,
done: false,
someRandom: 31431
},
{
id: 2,
label: 'Second Note' ,
done: false
},
{
id: 3,
label: 'Finished Third Note' ,
done: true
}
];
self.notes1 = angular.copy(notes);
self.notes2 = angular.copy(notes);
И есть метод который при клике по кнопке, изменяет значения self.notes.
self.changeNotes = function() {
notes = [
{
id: 1,
label: 'Changed Note' ,
done: false,
someRandom: 4242
},
{
id: 2,
label: 'Second Note' ,
done: false
},
{
id: 3,
label: 'Finished Third Note' ,
done: true
}
];
self.notes1 = angular.copy(notes);
self.notes2 = angular.copy(notes);
Изменяемый блок:
<div ng-repeat="note in ctrl.notes2 track by note.id">
{{note.$$hashKey}}
<span class="label">{{note.label}}</span>
<span class="author" ng-bind="note.done"></span>
</div>
Если я правильно понимаю, track by применяется, еслиd источнике данных есть какое-то повторяющееся поле, в примере выше
note.id. И при построении DOM, без "track by" каждый элемент объекта будет генерировать снова и снова при этом у него будет новый $$hashKey, но если с track id происходит итерация, то DOM дерево не генерируется вновь, а используется предыдущее? Но в чем тогда логика... Большая простба объяснить, как, где и зачем это применять? Спасибо большое за ответ!
