Observable forkJoin 从不执行管道

Posted

技术标签:

【中文标题】Observable forkJoin 从不执行管道【英文标题】:Observable forkJoin never execute pipe 【发布时间】:2022-01-20 04:36:38 【问题描述】:

我正在尝试使用管道从可观察的数组(每个都从 literalsService 获得)执行和获取值。代码如下:

translateLiterals() 
    const literalsToTranslate: string[] = [
    'certificate_title',
    'with_address',
    'hereby',
    'declare',
    'electronic_records',
    'proceeded_to_shipment',
    'return_address',
    'return_address',
    'addressee',
    'message_subject',
  ];
    const newArray: Observable<string>[] = [];
    literalsToTranslate.map(literal => newArray.push(this.literalsService.getValue('Ngwa.Ngwa', literal)));
    this.literalsArray$ = forkJoin([...newArray]).pipe(map((results) => 
      console.log(results);
      return results;
    ));
  

我当然订阅了 html 端的管道:

&lt;ng-container *ngIf="literalsArray$ | async"&gt;&lt;/ng-container&gt;

但是console.log() 从来不打印任何东西...有人知道为什么吗?

【问题讨论】:

你忘记订阅你的 observable。你也可以使用 rxjs 的“firstValueFrom” 您也错误地使用了.map()Array.map() 返回一个数组。你正在做一个 foreach。 @Carsten 他们在模板中使用async,所以会在那里订阅 this.literalService.getValue 返回什么?由此产生的可观察物是否完整? forkJoin 只有在所有 observables 都完成后才会通过 forkJoin() 的所有源 Observables 至少需要发射一次并完成,所以这可能是你什么都看不到的原因。 【参考方案1】:

正如用户@ShamPooSham 和@martin 在cmets 中所说,问题在于this.literalsService.getValue ('Ngwa.Ngwa', literals) 方法正在观察文字的变化,而forkJoin 方法从未启动,因为文字未完成。 我创建了一个单独的方法来解决问题,并在初始方法中添加了take

新方法:

translateString(text: string): Observable<string> 
    return this.literalsService.getValue('Ngwa.Ngwa', text).pipe(
      switchMap((translated) => 
        if (!translated.startsWith('N/A')) 
          return of(translated);
         else 
          return this.literalsService.getValue('Ngwa.Ngwa', text).pipe(
            skip(1), // First event translation comes not translated
            map((secondTryTranslation) => 
              return secondTryTranslation;
            ));
        
      ),
    );
  

修正第一种方法:

    translateLiterals() 
    const literalsToTranslate: string[] = [
    'certificate_title',
    'with_address',
    'hereby',
    'declare',
    'electronic_records',
    'proceeded_to_shipment',
    'return_address',
    'return_address',
    'addressee',
    'message_subject',
  ];
    const newArray: Observable<string>[] = [];
    literalsToTranslate.map(literal => newArray.push(this.translateString(literal).pipe(take(1)))); //<--- Here is the correction
    this.literalsArray$ = forkJoin([...newArray]).pipe(map((results) => 
      return results;
    ));
  ```

【讨论】:

【参考方案2】:

可能this.literalsService.getValue('Ngwa.Ngwa', literal); 返回字符串。 如果是这种情况,您需要将其转换为 Observable:

of(this.literalsService.getValue('Ngwa.Ngwa', literal));

同样forkJoin 等待所有给定的流完成,然后发出值。

【讨论】:

不,this.literalsService.getValue('Ngwa.Ngwa', literal); 返回一个 Observable 对象 你能提供getValue的定义吗?

以上是关于Observable forkJoin 从不执行管道的主要内容,如果未能解决你的问题,请参考以下文章

Rxjs:Observable.combineLatest vs Observable.forkJoin

如何在 Observable.forkJoin(...) 中捕获错误?

函数返回后 Observable.forkJoin 调用延迟

markdown 等待多个observable完成forkJoin

如何在RXJS 6.3.3中使用ForkJoin导入Observer?

可观察到的 forkJoin 没有触发