Angular 2 - 异步管道中的无限循环

Question

当我尝试像这样绑定(bind)一个异步函数时，我遇到了一个无限循环:

<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，这就是你得到“无限循环”的原因。尝试返回相同的 Promise 实例 ;-)

“无限循环”实际上不是传统的无限循环，而是 async 管道的副作用，它会在其输入 Promise 解析时触发变更检测周期。在这个新的变化检测周期中，angular 将调用 myAsyncFunc(i: string) 并获得一个新的 Promise 来观察，然后解决整个事情重新开始。