javascript / beginner
Snippet
Leistungsoptimierung mit trackBy
Beim Rendern von Listen hilft die trackBy-Funktion Angular dabei zu erkennen, welche Elemente sich tatsächlich geändert haben, um teure DOM-Neu-Renders zu vermeiden.
snippet.js
javascript
1
2
3
4
5
6
7
export class ListComponent {items = [{ id: 101, name: 'Apple' }, { id: 102, name: 'Banana' }];trackById(index: number, item: any): number {return item.id;}}
angular
Erklärung
1
trackById(index, item)
Erhält den Index des aktuellen Elements und das Element-Objekt selbst.
2
return item.id;
Gibt einen eindeutigen Bezeichner zurück, damit Angular dieses spezifische Element verfolgen kann.