Question

我有一种情况需要从Ionic 2应用程序中的存储中获取一段数据，然后使用该数据创建HTTP请求。我遇到的问题是SqlStorage方法返回promises，http meth返回一个observables。我必须做这样的事情才能让它发挥作用：

 getToken() {
    return this.storage.get('token').then((token) => {
        this.token = token;
        return token;
    });
 }

 loadStuff(){
    return this.tokenService.getToken().then(token => {
      return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).map(res => res.json());
    });
  }

然后做这样的事情让它发挥作用：

this.tokenService.loadStuff().then(observable => {
    observable.subscribe(data => {
         this.storage.set('stuff', data);
         return data;
    });
})

一般来说，我对Angular和Ionic都很陌生，所以我觉得有更好的方法来完成我想要做的事情，但我不知道怎么做。此外，关于可观察量的所有可用资源都会很快非常复杂非常，这让像我这样容易受到影响的年轻开发人员非常困惑。

任何人都可以更好地了解如何做到这一点吗？谢谢！

Answer 1

以下是您可以做的事情：

您的代码

 getToken() {
    return this.storage.get('token').then((token) => {
        this.token = token;
        return token;
    });
 }

更改为

getToken: Observable<any> = 
    Observable.fromPromise(this.storage.get('token').then(token => {
    //maybe some processing logic like JSON.parse(token)
    return token;
}));

然后在你的组件中你可以像任何其他可观察的那样使用它。

this.serviceClass.getToken.subscribe(token => { 
//whatever you want to with the token
});

Answer 2

在角度2中，Http服务函数（get，post等）返回Observable object。这就是他们实施它的方式。

如果您习惯承诺，并希望您的服务返回承诺，则可以使用toPromise对象中内置的Observable函数。

loadStuff(){
    return this.tokenService.getToken().then(token => {
        return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).toPromise());
    });
}

然后

this.tokenService.loadStuff().then(data => {
    data = data.json(); //you might need to do that, depending on the structure of the response
    this.storage.set('stuff', data);
    return data;
});

Answer 3

我使用Observable.fromPromise()和.flatMap()：

的组合让它工作

getToken() {
    return Observable.fromPromise(this.storage.get('token')
    .then((token) => {
        return token;
    }));
}

loadStuff(){
    return this.tokenService.getToken()
    .flatMap(token => {
        return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token)
        .map(res => {
            return res.json();
        });
    });
}

this.tokenService.loadStuff().subscribe(data => {
    this.storage.set('stuff', data);
    return data;
});

您还需要添加这些导入：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/fromPromise';
import 'rxjs/add/operator/mergeMap';

Answer 4

使用'Observable.fromPromise'将promise转换为observable。

Ionic 2 / Angular 2承诺返回可观察的

4 个答案: