Reading through this article and it has an ngFor loop like this:

*ngFor="let contact of contacts | async"

How does the async pipe work in this context?

Reading through this article and it has an ngFor loop like this:

*ngFor="let contact of contacts | async"

How does the async pipe work in this context?

• javascript
• html
• angular

• angular.io/api/mon/AsyncPipe. In other words, it tells the ponent to update when a new value is emitted (as opposed to an entire collection upfront) via a RxJS subscription. It also automatically unsubscribes the ponent from the observable when the ponent is destroyed. – ryanlutgen Commented Jan 8, 2018 at 23:25

1 Answer 1

The async pipe gives the latest value from an observable. In this case (as in other cases) it will refresh the data involved when a new value es down the observable. So if the screen renders and the observable updates the ngFor will re-render.