Question

好的，我需要再一次帮助解决我在使用Angular2 / Typescript时遇到的问题。

这是我的简化代码：

/// <reference path="../node_modules/angular2/typings/browser.d.ts" />

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';

@Component({
    selector: 'hello-app',
    template: `
        <h1>Foo:{{getFoo("FooBar") | async}}</h1>
    `
})
export class HelloApp {

  getFoo(parameter): Promise<string> {
    return new Promise((resolve) => resolve(parameter));
  }

}

bootstrap(HelloApp);

当你尝试运行它时，它将循环，冻结我的浏览器选项卡，直到我杀了它。

以下代码工作正常，但由于我需要传递参数，因此无法执行我想要的操作...

/// <reference path="../node_modules/angular2/typings/browser.d.ts" />

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';

@Component({
    selector: 'hello-app',
    template: `
        <h1>Foo:{{foo | async}}</h1>
    `
})
export class HelloApp {

  foo: Promise<string> = new Promise((resolve) => resolve("foobar"));

}

bootstrap(HelloApp);

有任何线索吗？提前谢谢！

Answer 1

问题是，在使用getFoo调用绑定时，您会多次创建一个promise，并使用async管道在其上注册。您应该将promise设置为字段以避免此行为，并且只需调用getFoo方法来初始化promise。

当使用Promise时，Angular 2进入循环

1 个答案: