Angular 2 - Endless loop in async pipe

Question

I`m getting an endless loop when I try to bind a async function like this:

     {{myAsyncFunc(i) | async}}<         


        

Answer 1

You can check my blogpost on this specific topic, when it strikes our project consuming 5GB od browser RAM :)
It's here

Simplest way to heal this issue is (as already mentioned) don't use function returned promise direct in template: {{ getPromise(id) | async }} but store this promise in controller (.ts file) and refer to it in view.
In addition, this can be healed by changing change detection settings to push-pull, but in my opinion it's brings way more evil than good.