Question

我在使用有角度的打字稿中可观察到的获取Web API输出时遇到问题。

我想获取第一个可观察对象将返回的值，然后将其值传递给另一个可观察对象。到目前为止，这是我写的。

let output: any;
let output2: any;

_httpClient.get('http://localhost:5000/api/mycontroller')
  .subscribe((output_1) => {
    output = output_1;
  });

alert(output);

_httpClient.get('http://localhost:5000/api/mycontroller2'+output)
  .subscribe((output_2) => {
    output2 = output_2;        
  });
alert(output2);

我在每个可观察到的订阅下方放置一个警报功能，以检查每个响应返回的输出。

但是当我执行它并检查警报框中的输出时，它会为每个提供不确定的值。

如何强制observable提供来自Web API的输出？

Answer 1

您可以使用诸如switchMap之类的运算符，该运算符根据文档“映射到可观察的，完整的先前内部可观察的，发出值”。当发出第一个switchMap调用的源时，它将使用HttpClient切换到映射第一个可观察到的第二个HttpClient调用。如果执行了新的初始/外部请求，它将取消进行中/过程中的请求。

请记住，您的alert()语句的设置方式将无法正常工作，因为alert()会在请求完成之前执行，因此undefined会执行。您需要在alert()内执行subscribe或类似操作，或使用do / tap之类的运算符来确保已实际返回数据。

import { switchMap } from 'rxjs/operators';

_httpClient.get('http://localhost:5000/api/mycontroller')
  .pipe(
    switchMap(output => _httpClient.get('http://localhost:5000/api/mycontroller2' + output))
  )
  .subscribe(output2 => alert(output2));

如果需要将输出保存到某些本地类属性，则可以使用do/tap在返回/映射/处理数据之前/之后执行操作。

import { switchMap, tap } from 'rxjs/operators';

_httpClient.get('http://localhost:5000/api/mycontroller')
  .pipe(
    tap(output => {
        console.log(output);
        this.output = output;            
    }),
    switchMap(output => _httpClient.get('http://localhost:5000/api/mycontroller2' + output)),
    tap(output2 => {
        console.log(output2);
        this.output2 = output2;            
    })
  )
  .subscribe(output2 => alert(output2));

希望有帮助！

Answer 2

为了完整地接受答案，还应提及switchMap的其他替代方法。

与switchMap相比，如果“外部可观察到的”运算符在第二次发出之前mergeMap（也称为flatMap）运算符将不被取消“内部可观察”完成。在HttpClient.get的情况下，可能不会导入该对象，因为它通常只发射一次，因此永远不会再次触发内部可观察对象。

但是，在继续使用RxJS运算符时，尤其是在处理顺序数据流时，请注意switchMap和mergeMap之间的区别。

角度6：将可观察的响应传递给另一个可观察的对象

2 个答案: