Function spreadArrayStore$

Returns an observable that emits an array of store objects, one for each element in source's state. The emitted arrays will have references to the exact store objects included in the previous emission when possible, making them performant to use in *ngFor expressions without the need to use trackBy.

@Component({
  standalone: true,
  template: `
    @for (heroStore of heroStores$ | async; track heroStore) {
      <app-hero [heroStore]="heroStore" />
    }
  `,
  imports: [HeroComponent, AsyncPipe],
})
class HeroListComponent implements OnChanges {
  @Input() heroesStore!: Store<Hero[]>;
  protected heroStores$!: Observable<Array<Store<Hero>>>;

  ngOnChanges(): void {
    this.heroStores$ = spreadArrayStore$(this.heroesStore);
  }
}
Copy