Angular 8：observable.pipe() 不再工作了？

Question

我只是将我的应用程序从 Angular 7 升级到 Angular 8。 自迁移以来，我的一种方法似乎不再起作用。在 Observable 上（来自 HTTP POST），我想通过 .pipe() 执行一些操作。

调用者可以在返回的 Observable 上执行 .subscribe()。

login(username: string, password: string): Observable {
    const url =  `${this.baseUrl}/oauth/token`;
    const body = `username=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}&grant_type=password`;

    return this.http.post(url, body, this.httpOptions)
      .pipe( map(value => {
        console.info('Succeed');
        return of(true);
      }));
  }

不幸的是，地图似乎不再执行（控制台没有登录）。

有人帮我找到解决方法吗？ 提前致谢。

Answer 1

1. 使用可观察返回的值进行映射操作，我认为这是您应该更改的第一件事：

return this.http.post(url, body, this.httpOptions)
      .pipe( map(value => {
        console.info('Succeed');
        return of(true); // Here is an error. Don't use `of`.
      }));

1. 管道操作员仍在工作。因此，您的 HTTP 请求中可能存在错误。考虑改写如下并检查错误日志：

return this.http.post(url, body, this.httpOptions)
      .pipe( 
         map(value => {
           console.info('Succeed');
           return true;
         }),
         catchError(err => {
           console.error('HTTP ERROR: ', err);
           return throwError(err);
         })
       );

1. 我注意到，您正在使用 info 操作 (console.info('Succeed');)。检查开发工具日志的调试级别

Answer 2

您使用的映射运算符用于映射原始/原始值。

例如：你可以获取一个字符串，然后返回一个数字，或者获取一个对象并返回另一个对象。

但它不会打开返回的 observable，因为您需要使用 switchMap（参考：https://www.learnrxjs.io/operators/transformation/switchmap.html）

在这种情况下，不需要使用switchMap，只需返回true 而不是of(true) 应该会有所帮助。

在调用代码方面，确保你记得订阅从login返回的observable，否则永远不会发出http请求。