angular - 你能在 Angular 2(使用 Typescript)中返回一个 observable 作为 promise 吗?

标签 angular typescript ionic2

<分区>

我正在学习使用 Angular 2 和 Typescript 在 Ionic 2 中进行开发。

我立即尝试创建一个函数,该函数返回一个 promise ,该 promise 在观察到的变量发生变化时得到解决。

这对我来说很有用,可以在页面组件尝试使用它之前检测提供程序内的初始化何时完成。例如

api.isInitialized()
    .then(() => {
        //api provider is initialized. Now safe to call it!
        return api.fetch("NEWS");
    });
    .then((newsData) => {
        //do something with newsData
    });

我有以下导入:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
import { Observable} from 'rxjs/Observable';

为了检查我对 toPromise 如何工作的理解,我尝试调用以下函数。我只得到“testObservable 已更改”。 我希望也能“解决 promise ”。

我如何更改 testObservable 以产生已解决的 promise ?

 observerTest(){
    let testObservable: any;
    let testObserver: any;

    testObservable = Observable.create(observer => {
        testObserver = observer;
    });

    let myPromise = testObservable.toPromise();

    testObservable.subscribe(data => {
        console.log("testObservable has changed.");
        console.log(data);
    });

    myPromise.then(() =>{
        console.log("promise resolved.");
    });

    testObserver.next(true);
}

最佳答案

官方Angular tutorial包含示例,尤其是在 HTTP chapter 中.例如:

getHeroes(): Promise<Hero[]> {
  return this.http.get(this.heroesUrl)
           .toPromise()
           .then(response => response.json().data as Hero[])
           .catch(this.handleError);
}

delete(id: number): Promise<void> {
  const url = `${this.heroesUrl}/${id}`;
  return this.http.delete(url, {headers: this.headers})
    .toPromise()
    .then(() => null)
    .catch(this.handleError);
}

关于angular - 你能在 Angular 2(使用 Typescript)中返回一个 observable 作为 promise 吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42553597/

相关文章:

javascript - 如何以 Angular 制作日期输入掩码?

javascript - 带有 Angular 6(Angular Material)单选按钮和 *ngIf 的显示元素

javascript - 从外部将值传递给 Angular 应用程序

ionic2 - Ionic 2 - 幻灯片如何更改分页进度颜色?

javascript - 需要使用 css Appearance 属性将复选框转换为单选按钮

javascript - Ngswitch : show elements when typeof 'rating' is a number

angular - 在 Angular 2 + Immutable.js 中迭代(使用 *ngFor)

typescript :返回基于对象中 ReturnTypes 的联合

google-chrome - Ionic 2、Chrome 不断从磁盘缓存加载

google-maps - 带有 Ionic 3 的 Google Maps Native cordova 插件只显示一个灰色框