Rxjs combineLatest 确实在订阅中返回 observable

Question

在我需要根据 userid 拨打电话后，我正在尝试获取 Userid 和 serviceId，这里的 serviceId 问题是它没有将 observable 返回到 ts。

服务.ts

function getData():observable<any>{
   combineLatest([
      this.activeSellService.getActiveSellServiceId(),
      this.authService.getUserId(),
    ]).subscribe(([serviceId, userId]) => {
      if (serviceId&& userId) {
        const Url =
          'users/' +
          `${userId}` +
          '/services/' +
          `${serviceId}` +
          '?value=test
        return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
      }
    })
}

组件.ts：

 this.service.getData().subscribe(data=>{console.log(data));

即使它没有在控制台中打印数据，因为服务没有返回可观察的。请帮我解决这个问题。否则我们可以在 rxjs 中使用不同的解决方案吗？

Answer 1

试试这个

function getData():observable<any>{
   return combineLatest(
      this.activeSellService.getActiveSellServiceId(),
      this.authService.getUserId(),
    ).pipe(mergeMap([serviceId, userId]) => {
      if (serviceId && userId) {
        const Url =
          'users/' +
          `${userId}` +
          '/services/' +
          `${serviceId}` +
          '?value=test
        return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
      }
    })
}

注意combinelatest的参数，getData中没有订阅

例如在堆栈闪电战中：

https://stackblitz.com/edit/angular-rxjs-combinelatest-hjyfa6?file=src/app/app.component.ts

Answer 2

您需要使用像switchMap 这样的高阶映射运算符从一个可观察对象映射到另一个。此外，subscribe() 函数只接受回调，只返回包含订阅的Subscription 对象。

如果if 条件失败，您也不会返回任何内容。您可以返回一个类似 RxJS 常量 EMPTY 的 observable，如果条件失败，它会立即完成订阅。

还有

1. observable<any> 必须是 Observable<any>
2. 您还没有从函数中返回。
3. Typescript 中不需要 function 关键字。相反，您可以提及范围标识符。
4. 您将字符串连接与模板文字混合在一起。虽然它在语法上没有错误，但我认为最好还是选择其中一个。
5. 从函数的上下文猜测，我相信您希望发出一次请求并完成它。而不是combineLatest 提供的数据流。在这种情况下，您可以改用forkJoin。但请注意，forkJoin 仅在其所有来源完成时才会发出。

试试下面的

import { Observable, forkJoin, EMPTY } from 'rxjs';
import { switchMap } from 'rxjs/operators';

public getData(): Observable<any> {
  return forkJoin([
    this.activeSellService.getActiveSellServiceId(),
    this.authService.getUserId(),
  ]).pipe(
    switchMap(([serviceId, userId]) => {
      if (!!serviceId && !!userId) {
        const Url = `users/${userId}/services/${serviceId}?value=test`;
        return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
      } else {
        return EMPTY;
      }
    })
  );
}