Usage no npm install needed!

<script type="module">
  import ngTrackBy from 'https://cdn.skypack.dev/ng-track-by';
</script>

README

trackBy and trackById directives

build passing tests passing license

Library for set a value of the ngForTrackBy without adding any code to a component using only a template.

Usage

Add directive(s) to module:

import { CommonModule } from "@angular/common";
import { TrackByModule, TrackByIdModule } from "ng-track-by";

@NgModule({
    imports: [CommonModule, TrackByModule, TrackByIdModule],
    declarations: [MyComponent],
})
export class MyComponentModule {}

Now you can use trackBy and trackById:

<ul *ngFor="let user of users" trackBy="name">
    <li>{{ user.name }}</li>
</ul>

<ul *ngFor="let item of items" trackById>
    <li>{{ item.value }}</li>
</ul>

The trackById is an alias for trackBy="id".

The trackBy directive specifies the key in item of a collection according to which compute the identity of items.