不要从服务层到组件返回可观察的值

Question

我正在尝试将服务层的返回传递给组件。

我的服务与 api 连接：

 public getPerfilNew$(): Observable<PerfilInvestidor> {
            return this.http.get<PerfilInvestidor>(`${environment.api.basePosicaoConsolidada}/consolidado`)
              .pipe(
                map(res => res),
                shareReplay(1),
                catchError(err => {
                    console.log('Error in perfil', err);
                    return throwError(err);
                })
            )
        }

public getPositionConsolidated(): Observable<PosicaoConsolidada> {
    return this.http.get<PosicaoConsolidada>(`${environment.api.basePosicaoConsolidada}/consolidado`)
      .pipe(
        map(res => res),
        shareReplay(1),
        catchError(err => {
            console.log('Error investiments', err);
            return throwError(err);
        })
    )
}

在我的组件中：我试过了

public loadData() {
        //find out if the profile failed or no
        this.homeGuardService.getPerfilNew$.pipe(
            takeUntil(this.unsubscribe) 
        ).subscribe(res => {
            this.perfilInvestidor = res;
            this.perfilFailed = this.perfilInvestidor.status ? true : false;
            console.log('perfil is failed --->', this.perfilFailed)
        })

        //checking for investments
        this.homeGuardService.getPositionConsolidated().subscribe(res => {
            this.positionConsolidated = res
            if (this.positionConsolidated) {
                this.investments = true
            }
        });


        this.isEverthingFailed = !this.investments && this.perfilFailed
}

我需要外部订阅值来匹配我的变量 isEverthingFailed teria que utilizar 主题？行为主体？因为这样变量 investments 和 perfilFailed 是未定义的

有了这么多的 observables 我会影响内存？我愿意接受建议

Answer 1

您可以使用 forkJoin 或 combineLatest 获取两个流并订阅它们：

public loadData() {
  forkJoin([this.homeGuardService.getPerfilNew$(), this.homeGuardService.getPositionConsolidated()])
    .subscribe(([perfile, position]) => {
        this.perfilInvestidor = perfile;
        this.perfilFailed = this.perfilInvestidor.status ? true : false;
        console.log('perfil is failed --->', this.perfilFailed)
        this.positionConsolidated = position
        if (this.positionConsolidated) {
            this.investments = true
        }
        this.isEverthingFailed = !this.investments && this.perfilFailed
    })
  )
}

Answer 2

1.问题

这里没有足够的代码来查看到底发生了什么。但乍一看，从我的角度来看，它看起来像是一种竞争条件：

您必须了解主题的工作原理。

const sub = new Subject();
sub.next(1);

// If you subscribe here like:
   sub.subscribe(a => console.log(a))
// Nothing will happen because Subject does not preserve the old values

但如果你这样做：

const sub = new Subject();

// If you subscribe here like:
sub.subscribe(a => console.log(a))

sub.next(1);

// You will get a print in a console since you emitted the value after you subscribed on the stream.

在您的情况下，您似乎是在主题已经发出值之后订阅主题。

还有：

 this.perfilClient$.subscribe(res => {

您正在订阅 this.perfilClient$，但我没有看到您在该流上的哪个位置发出值？

因此，如果您无法在 Subject 发出值之前同步您订阅的内容，您可以使用 ReplaySubject 或 BehaviourSubject

2。问题 你只有几个可观察的，它并不多。但也有一些反模式，例如：

1. 嵌套订阅
2. 订阅回调函数为空 等等。

RXJs主要是尽量避免副作用。