将 Rxjs 代码转换为 Angular 6 和最新的 rxjs

Question

场景：

• Angular新手
  尝试将Angular 2 代码迁移到Angular 6。
• 知道我是怎么做的吗 可以在angular6
中改写如下代码

要写入的代码 Angular 6 :

return this._http.post(this.apiBaseUrl + "/api/login", body, options)
   .timeoutWith(Constant.timeout, Observable.throw(new Error(Constant.timeoutMsg)))
      .map(response => {
            const result = response.json() as LoginResultModel;

            if (result.AccessToken != null) {
                this.setLoginToken(result);
                return result;
            } else {
                return response;
            }
        });

Answer 1

只需使用 pipe 方法并将 timeoutWith 和 map 运算符作为函数作为其参数：

import { throwError } from 'rxjs';
import { map, timeoutWith } from 'rxjs/operators';

return this._httpClient.post<LoginResultModel>(this.apiBaseUrl + "/api/login", body, options)
  .pipe(
    timeoutWith(Constant.timeout, throwError(new Error(Constant.timeoutMsg))),
    map(result => {
      if (result.AccessToken != null) {
        this.setLoginToken(result);
        return result;
      } else {
        return response;
      }
    })
  );

更多关于 RxJS 6 中的 pipable 运算符：

https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

注意我也使用了 HttpClientModule，你不需要使用 response.json() 方法，更多关于这里：

https://angular.io/guide/http