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

问题描述:

当我尝试绑定这样的异步函数时,我将陷入无限循环:

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

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

这是函数:

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

我做错了什么?还是这是一个错误?

I'm doing something wrong? Or this is a bug?

您每次调用都会从myAsyncFunc(i: string)返回一个新的Promise,这就是为什么会出现无限循环"的原因.尝试返回相同的Promise实例;-)

You're returning a new Promise from myAsyncFunc(i: string) on every call, that's why you get an "endless loop". Try returning the same Promise instance ;-)

无穷循环"实际上不是传统的无穷循环,而是async管道的副作用,当其输入Promise解析时会触发更改检测周期.在这个新的更改检测周期中,angular会调用myAsyncFunc(i: string)并获得一个新的Promise来观察,然后解决整个问题重新开始.

The "endless loop" is actually not a traditional endless loop but rather a side-effect of async pipe triggering a change detection cycle when its input Promise resolves. On this new change detection cycle, angular will call myAsyncFunc(i: string) and get a new Promise to observe, which then resolves the whole thing starts again.