如何将 promise 方法转换为 angular 10 中的 rxjs Observables

Question

我是 typescript 和 angular 和 observables 的新手。 我的问题是我有这种方法，它采用 URL 并返回 URL 的图标。 如何使用 observables 而不是 promise

 getFavIcon(url: string): Promise<any> {
      return new Promise((resolve, reject) => {
        const hostname = this.getDomain(url);
        const src = 'http://' + hostname + '/favicon.ico';

        const image = new Image();
        image.onerror = () => {
            reject({ hasFavourite: false });

        };
        image.onload = () => {
            resolve({ hasFavourite: true, imageURL: src});
        };
        image.src = src;
      });
  }

Answer 1

它的创建与 promise 非常相似，除了 observable 可以是一个连续的 stream 并且你有complete()它的行为类似于 Promise

 getFavIcon(url: string): Promise<any> {
      return new Observable((obs) => {
        const hostname = this.getDomain(url);
        const src = 'http://' + hostname + '/favicon.ico';

        const image = new Image();
        image.onerror = () => {
            obs.error({ hasFavourite: false });

        };
        image.onload = () => {
            obs.next({ hasFavourite: true, imageURL: src});
            obs.complete()
        };
        image.src = src;
      });
  }