首页 > 解决方案 > 从对象创建 Observable

问题描述

我如何从这个对象创建一个 Observable?

this.localStorage.getItem('user').subscribe((user) => {
      if (user != null) {
        console.log(user);
        console.log('User existiert!');

        // Create Observable
        this.data = new Observable((observer: any) => {
          observer.next(user);
          observer.complete();
        });

        return this.data;

      }
    });

用户对象如下所示:

在此处输入图像描述

我将其写入服务,但从组件订阅不起作用。什么问题?

标签: angulartypescriptrxjsobservable

解决方案


您需要在服务方法中返回一个 observable,并让组件调用该方法来获取 observable。

同样正如 jonrsharpe 已经提到的,您不需要创建另一个 observable。如果您想对数据进行转换或使用console.log.

import { map } from 'rxjs/operators';
import { LocalStorage } from '@ngx-pwa/local-storage@6';

class Service {

  constructor(private localStorage: LocalStorage) {}

  // this is the naive approach
  getUser() {
    return new Observable((observer) => {
      this.localStorage.getItem('user').subscribe((user) => {
        if (user != null) {
          console.log(user);
          console.log('User existiert!'); 
        }
        observer.next(user);
        observer.complete();
      });
    });
  }

  // this is a better approach
  getUser() {
    return this.localStorage.getItem('user').pipe(
      map((user) => {
        if (user != null) {
          console.log(user);
          console.log('User existiert!');
        }
        return user
      }),
    );
  }
}

推荐阅读