Angular2可观察和无极 [英] Angular2 Observable and Promise

问题描述

我开始使用Angular2 Observable，但是找不到与Promises一起使用的.then类似的东西.

I started using Angular2 Observable, but I can't find something similar to .then that I used with Promises.

这就是我要完成的事情.

This is what I want to accomplish.

public login() {
    this._user = AuthService.getInstance().login(this._loginInfo);
}

来自auth.service.ts的代码

return this._httpClient.post('LoginAction', credentials)
  .map(res => res.json())
  .subscribe(user => {
    return new User(user);
  });

带有承诺，login函数将返回Promise，最终将转换为服务器的实际响应.但是使用Observable，这将无法正常工作.

With promises, login function would return Promise, that would eventually transform to actual response from server. But with Observable this won't work.

有没有办法做类似的事情?我想避免需要将订阅放入component的login函数中.我希望能够完成服务中的所有工作，并将实际对象返回给component.

Is there a way to do similar thing? I want to avoid need of putting subscribe inside component's login function. I want to be able to do all the work in service, and to return actual object to component.

此外，我尝试使用toPromise创建Promise，但是我一直在获取toPromise is not a function.

Also, I tried to create Promise, with toPromise, but I keep getting toPromise is not a function.

p.s. _httpClient是我对angular2 http的包装，在其中我通过添加一些标头等来准备请求.

p.s. _httpClient is my wrapper around angular2 http in which I prepare request by adding some headers etc.

return this._httpClient.post('LoginAction', credentials)
  .map(res => res.json())
  .toPromise().    <-- i keep getting that it is not a function
  then(user => {
    return new User(user);
});

这样做，我的组件将获得对象(这是它所需要的)，并且在服务中，我可以做其他事情(例如，一旦我登录他，将用户保存到本地存储中).

by doing this, my component will get object (which is what it need), and in service i could do additional things (like saving user to localstorage, once I logged him).

然后我切换到了Promise，因为对Observable进行的操作不起作用(或者我做错了)吗?

And I switched to Promise, because doing same with Observable is not working (or I am doing it wrong)?

我看到返回的对象是可观察的(在调用Promise之前)，但是我确实没有看到toPromise函数.

I see that returned object is Observable (before calling toPromise), but I don't see toPromise function indeed.

推荐答案

当您呼叫subscribe(...)时，将返回一个没有toPromise()的Subscription.如果将代码从subscribe移到map，则可以使用toPromise()代替subscribe

When you call subscribe(...) a Subscription is returned which doesn't have a toPromise(). If you move the code from subscribe to map you can use toPromise() instead of subscribe

return this._httpClient.post('LoginAction', credentials)
  .map(res => res.json())
  .map(user => {
    return new User(user);
  }).toPromise();

，呼叫者将得到一个Promise，他可以在其中使用

and the caller will get a Promise where he can get the value using

public login() {
    this._user = AuthService.getInstance().login(this._loginInfo)
    .then(result => {
      doSomething();
    });
}

，但是如果省略`.toPromise()，并且调用方像

but you get the same result if you omit `.toPromise() and the caller uses it like

public login() {
    this._user = AuthService.getInstance().login(this._loginInfo)
    .subscribe(result => {
      doSomething();
    });
}

唯一的区别是subscribe()而不是then()，并且如果库的用户更喜欢反应式样式，他将更喜欢像以前一样使用subscribe().

where the only difference is subscribe() instead of then() and if the user of the library prefers the reactive style he will prefer using subscribe() like he is used to.

这篇关于Angular2可观察和无极的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！