Угловое 2 - Бесконечная петля в асинхронном трубе

Question

I`m получать бесконечный цикл, когда я пытаюсь связать функцию асинхронной так:

<tr *ngFor="let i of items"> 
    <td>{{myAsyncFunc(i) | async}}</td> 
</tr> 

это функция:

private myAsyncFunc(i: string): Promise<string> { 
     return Promise.resolve("some"); 
} 

Я что-то не так? Или это ошибка?

Answer 1

Вы возвращаете новое обещание от myAsyncFunc(i: string) на каждый звонок, поэтому вы получаете «бесконечный цикл». Попробуйте вернуть тот же экземпляр Promise ;-)

«Бесконечная петля» на самом деле не является традиционным бесконечным циклом, а скорее побочным эффектом трубы async, запускающей цикл обнаружения изменений, когда решается его ввод Promise. В этом новом цикле обнаружения изменений угловой вызовет myAsyncFunc(i: string) и получит новое обещание наблюдать, которое затем разрешает все это начинается снова.

Answer 2

Вы можете проверить мой BlogPost на этой конкретной теме, когда он поражает наш проект потребляющих 5gb од браузера RAM :)
Это here

Простейший способ излечить эту проблему (как уже упоминалось) не используют функция возвращает обещание прямо в шаблоне: {{ getPromise(id) | async }}, но сохраните это обещание в контроллере (.ts файл) и обратитесь к нему в поле зрения.
Кроме того, это можно исправить, изменив настройки обнаружения изменений на push-pull, но, на мой взгляд, это приносит больше зла, чем пользы.