[dataSource] does not support Observables (using async pipe)

[jurajplavcan]

I tried to use other than static array for carousel items - I hooked up an observable of an array via an async pipe, but the behavior is strange.
Reproduction (I tried to cut the scenario to a very basic one):
https://stackblitz.com/edit/ngu-carousel-observable-data-source

Observable in the scenario above:

    this.carouselTileItems$ = interval(1000)
      .pipe(
        startWith(-1),
        take(10),
        map(i => [i, i + 1, i + 2])
      );

Only the last carousel tile is updated with new observed item. Moreover checking the page DOM, there are many <ngu-tile>s created as the observable keeps serving new values (but to a user the carousel always appears to contain only 3 tiles):

Am I doing anything wrong? Did I forget any config?

[sheikalthaf]

@jurajplavcan Hi,

Thanks for reporting. Fixed this issue. I forgot to remove the item whose currentIndex is null. Will Push the update.

[sheikalthaf]

@jurajplavcan this issue is fixed. Please check release.

Thanks

[jurajplavcan]

@sheikalthaf It works now as expected! Thank you
https://stackblitz.com/edit/ngu-carousel-observable-data-source-fixed

[kleino]

@sheikalthaf There still seems to be an issue with observables when displaying more than one tile at the same time. Some tiles get duplicated after a couple of times. See https://stackblitz.com/edit/ngu-carousel-observable-data-source-vx6xfk for an example