Angular 把承诺变成可观察的

我试着把我的头绕在可观察的物体上。我喜欢Observable解决开发和可读性问题的方式。正如我读到的，好处是巨大的

HTTP和集合上的可观察对象似乎是直截了当的。我怎样才能把这样的东西转换成可观察的模式呢

这来自我的服务组件，用于提供身份验证。我希望它能像Angular2中的其他HTTP服务一样工作——支持数据、错误和完成处理程序

firebase.auth（）.createUserWithEmailAndPassword（电子邮件，密码）
.then（函数（firebaseUser）{
//做一些事情来更新你的UI组件
//将用户对象传递给UI组件
})
.catch（函数（错误）{
//在这里处理错误。
var errorCode=error.code；
var errorMessage=error.message；
// ...
});

这里的任何帮助都将不胜感激。我唯一的替代方案是创建

EventEmitter

s。但我想这是一种可怕的方式，在服务部分做事情

导入'rxjs/add/observable/fromPromise'；
从“rxjs/Observable”导入{Observable}；
const subscription=Observable.fromPromise(
firebase.auth（）.createUserWithEmailAndPassword（电子邮件，密码）
);
subscription.subscripte（firebaseUser=>/*对收到的数据执行任何操作*/，
error=>/*在此处处理错误*/）；

---

如果您使用的是RxJS 6.0.0，您可以找到fromPromise运算符的完整参考。

：

从'rxjs'导入{from}；
可观测常数=来自（承诺）；

您还可以使用主题并从promise中触发其next（）函数。见下面的示例：

添加如下代码（我使用过服务）

类用户服务{
私有createUserSubject:Subject；
createUserWithEmailAndPassword（）{
if（this.createUserSubject）{
返回this.createUserSubject；
}否则{
this.createUserSubject=新主题（）；
firebase.auth（）.createUserWithEmailAndPassword（电子邮件，
密码）
.then（函数（firebaseUser）{
//做一些事情来更新你的UI组件
//将用户对象传递给UI组件
this.createUserSubject.next（firebaseUser）；
})
.catch（函数（错误）{
//在这里处理错误。
var errorCode=error.code；
var errorMessage=error.message；
this.createUserSubject.error（错误）；
// ...
});
}
}
}

1直接执行/转换 用于将先前创建的承诺直接转换为可观察的承诺

从'rxjs'导入{from}；
//一旦调用getPromise（），承诺就会传递给可观察对象
const observable$=from（getPromise（））；

observable$

将是一个热门的observable，可以有效地向订户重播承诺价值

它是一个热门的可观察对象，因为生产者（在本例中是承诺）是在可观察对象之外创建的。多个订户将共享同一承诺。如果内部承诺已经解决，可观察对象的新订户将立即获得其价值

2每个订阅上的延迟执行 与承诺工厂函数一起使用作为输入，以延迟承诺的创建和转换为可观察的

从'rxjs'导入{defer}；
//每次有人订阅可观察对象时，都会调用getPromise（）$
const observable$=延迟（（）=>getPromise（））；

可观测$

将是一个冷可观测

它是一个冷的可观察对象，因为生产者（承诺）是在可观察对象内部创建的。每个订户将通过调用给定的Promise factory函数来创建一个新的Promise

这允许您创建一个

可观察的$

，而无需立即创建并执行承诺，也无需与多个订户共享此承诺。

observable$

的每个订户有效地从（promiseFactory（））调用

。订阅（订户）

。因此，每个订户创建并将其自己的新承诺转换为新的可观察对象，并将自己附加到这个新的可观察对象上

3许多运营商直接接受承诺 大多数RxJS运营商组合（例如，

merge

，

concat

，

forkJoin

，

combinelatetest

）或转换可观察对象（例如，

switchMap

，

mergeMap

，

concatMap

，

catchError

）直接接受承诺。如果您正在使用其中一个，那么您不必先使用

from

来包装承诺（但要创建冷可观察的，您可能仍然需要使用

延迟

）

//同时执行两个承诺
forkJoin（getPromise（1）、getPromise（2））管道(
switchMap（（[v1，v2]）=>v1.getPromise（v2））//映射到嵌套的Promise
)

检查or以查看您使用的运算符是否接受

observeibleInput

或

SubscribableOrPromise

type observateInput=SubscribableOrPromise | ArrayLike | Iterable；
//注意类似于------------------------------------------v的承诺
类型SubscribableOrPromise=Subscribable | Subscribable | PromiseLike |可互观测；

---

示例中

from

和

defer

之间的差异：

const getPromise=val=>新承诺（解析=>{
console.log（'Promise created for'，val）；
setTimeout（（）=>resolve（`Promise Resolved:${val}`），5000）；
});
//getPromise（'FROM'）的执行从这里开始，当您从中创建承诺时
const fromPromise$=from（getPromise（'from'））；
const deferPromise$=defer（（）=>getPromise（'defer'）；
fromPromise$.subscribe（console.log）；
//getPromise（“延迟”）的执行从这里开始，当您订阅延迟承诺时$
.subscribe（console.log）；

你妈

import { of, Observable, defer } from 'rxjs'; 
import { map } from 'rxjs/operators';


function getTodos$(): Observable<any> {
  return defer(()=>{
    return fetch('https://jsonplaceholder.typicode.com/todos/1')
      .then(response => response.json())
      .then(json => {
        return json;
      })
  });
}

getTodos$().
 subscribe(
   (next)=>{
     console.log('Data is:', next);
   }
)