Observable forkJoin 从不执行管道

Posted 2023-03-13

【中文标题】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 端的管道：

<ng-container *ngIf="literalsArray$ | async"></ng-container>

但是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的定义吗？