Angular / Typescript 将 Promise 方法转换为 Observable

Question

我有按预期工作的方法：

getdata(): Promise<any> {
    let query = `SELECT * FROM table`;
    return new Promise((resolve, reject) => {
      this.db.query(query, (error, rows) => {
        if(error) reject(error);
        resolve(rows);
      });
    });
}

ngOnInit() {
    this.myservice.getdata().then(result => {
      this.data = result;
    })
}

我正在使用 Angular 9 / Electron

如何将其更改为 Observable？

Answer 1

您可以将任何承诺包装在 from 中以将其转换为可观察对象：

getdata(): Observable<any> {
    let query = `SELECT * FROM table`;
    return from(new Promise((resolve, reject) => {
      this.db.query(query, (error, rows) => {
        if(error) reject(error);
        resolve(rows);
      });
    }));
}

或者你可以跳过 promise 直接创建一个 observable：

getdata(): Observable<any> {
    let query = `SELECT * FROM table`;
    return new Observable((obs) => {
      this.db.query(query, (error, rows) => {
        if (error) {
          obs.error(error);
        } else {
          obs.next(rows);
          obs.complete();
        }
      });
    });
}

Answer 2

您可以尝试 return RxJS Subject observable。

completed$ = new Subject<any>();

getdata(): Observable<any> {
  const result = new BehaviorSubject<any>(null);
  const query = `SELECT * FROM table`;
  this.db.query(query, (error, rows) => {
    error ? result.error(error) : result.next(rows);
  });
  return result.asObservable();
}

ngOnInit() {
  this.myservice.getdata().pipe(
    takeUntil(this.completed$)
  ).subscribe(
    rows => {
      if (rows) {          // <-- check if response is valid
        this.data = rows;
      } 
    },
    error => { }
  );
}

ngOnDestroy() {
  this.completed$.next();
  this.completed$.complete();
}

Answer 3

将第一个参数为 error ("Node.js-style callback") 的回调函数转换为 Observable 最好使用 bindNodeCallback:

getdata(): Observable<any> {
  const query = `SELECT * FROM table`;
  return bindNodeCallback(this.db.query)(query)
}

// subscribing:
ngOnInit() {
  this.myservice.getdata().subscribe(result => {
    this.data = result;
  });
}

Reference

Answer 4

最正确的方法是使用bindNodeCallback

getdata(): Promise<any> {
  return bindNodeCallback(this.db.query)(`SELECT * FROM table`);
}

ngOnInit() {
  this.myservice.getdata().subscribe(result => {
    this.data = result;
  });
}

Angular / Typescript 将 Promise 方法转换为 Observable

Angular / Typescript convert Method with Promise to Observable

observable

rxjs

typescript

es6-promise

angular