RXJS

Question

我有一个 inputIds 的数组，我正在做一个映射，其中 return 是一个名称和值对象。在地图内部，我调用 this.inputService.getInputFieldObject，其中 return 是 Observable<InputValue>。如何 return 订阅值而不是 return 订阅值数组？所以我可以将属性 returned 作为一个只有名称和值的数组。

const attributes = inputIds.map((attributeName: string) => {
  // this.inputService.getInputFieldObject returns Observable<InputValue>

  const inputSubscription = this.inputService.getInputFieldObject(attributeName).subscribe((val) => val.value)

  return {
    name: attributeName,
    value: inputSubscription, // is there a getValue method to get value of subscription?
  };
});

Answer 1

您可以将其包装在 forkJoin 中并订阅它，如下所示：

forkJoin(
   inputIds.map((attributeName: string) => 
       this.inputService.getInputFieldObject(attributeName).pipe(
           map((inputValue: InputValue) => { 
               return { 
                   name: attributeName,
                   value: inputValue
               };
           })
       )
).subscribe(
    (result: { name: string, value: InputValue }[]) => {
        // do what you need to do with the result
    },
    (error) => {
        // add code here if you need to handle failure on any of the calls 
        // to this.inputService.getInputFieldObject(), or any processing thereafter.
    }
);

解释代码的作用：

1. 这会为 inputIds 中的每个 attributeName 调用 inputService.getInputFieldObject()。这 return 是 Observables<InputValue>

的数组

inputIds.map((attributeName: string) => this.inputService.getInputFieldObject(attributeName))

2. 我们将每个对 this.inputService.getInputFieldObject() 的调用通过管道传输到一个映射到 return attributeName 和 inputValue。因此，我们现在 returning 一个 Observables<{ name: attributeName, value: inputValue }>

的数组

this.inputService.getInputFieldObject(attributeName).pipe(
    map((inputValue: InputValue) => { 
        return { 
            name: attributeName,
            value: inputValue
        };
    })
)

3. 然后我们用 forkJoin 包装所有这些，然后订阅它。 forkJoin 可以接收一个 Observables 数组并等待所有个 Observables complete。通过这样做，我们在处理结果之前等待所有可观察到 return 它们的（最终）发射值。因此，您在 subscribe() 中收到的值将是 { name: string, value: InputValue }:

的数组

forkJoin(
    ....
).subscribe((result: { name: string, value: InputValue }[]) => {
  // do what you need to do with the result
})

重要提示：

如果对 inputService.getInputFieldObject() 的任何调用失败，将触发 subcribe() 上的错误回调，而不是成功回调。

RXJS - return 做地图时的可观察值

RXJS - return observable value when doing a map

javascript

rxjs-observables