无法将“rxjs”导入 Angular 5 应用程序

Question

我正在尝试导入

import 'rxjs/add/operator/map';

但是，我不断收到错误消息 “'Observable'类型上不存在属性'Map'”

我尝试了不同的导入，以及 rxjs 的不同导入组合。每一个都会产生相同的错误或列入黑名单的错误。我在 tslint.json 中允许了 rxjs，但仍然收到上述错误。

与

Import { Observable } from 'rxjs/Observable';

它给了我：“模块没有导出的成员'Observable'”

这就是我正在使用的：

import { Injectable } from '@angular/core';
import {Http, Response, RequestOptions, Headers} from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';


@Injectable({
  providedIn: 'root'
})
export class AuthService {
  baseUrl = 'http://localhost:5000/api/auth';
  userToken: any;

constructor(private http: Http) { }

login(model: any) {
  const headers = new Headers({'Content-type': 'application/json'});
  const options = new RequestOptions({headers: headers});
  return this.http.post(this.baseUrl + 'login', model, options).map((response: Response) => {
    const user = response.json();
    if (user) {
      localStorage.setItem('token', user.tokenString);
      this.userToken = user.tokenString;
    }
  });
}
}

Answer 1

在 RxJS6 中，您的导入应该类似于以下内容：

(1) rxjs：创建方法、类型、调度器和实用程序

import { Observable, Subject } from 'rxjs';

(2) rxjs/operators：所有可管道操作符：

import { map, filter, scan } from 'rxjs/operators';

更多信息请阅读migration guide和import paths。

也可以使用pipe代替链接，例如：

 login(model: any) {
  const headers = new Headers({'Content-type': 'application/json'});
  const options = new RequestOptions({headers: headers});
  return this.http.post(this.baseUrl + 'login', model, options).pipe(

    map((response: Response) => {
    const user = response.json();
    if (user) {
      localStorage.setItem('token', user.tokenString);
      this.userToken = user.tokenString;
    }
  }));

}