RsJX'Map'运算符在Angular 6中不起作用

Question

我正在尝试使用map来自RxJS的运算符,但它会抛出一个错误说

"Observable"类型中不存在属性"map".

这是代码:

    import { Injectable } from "@angular/core";
    import { Http } from "@angular/http";
    import "rxjs/add/operator/map";
    @Injectable()

    export class DataService {
     constructor(public http: Http) {}

     getData() {
       return this.http
        .get("https://jsonplaceholder.typicode.com/users")
        .map(res => res.json());
      }
    }

Answer 1

首先Http在高于Angular 4的版本中弃用.相反,它需要使用HttpClient与HttpClientModule从"@angular/common/http".使用HttpClient您将获得JSON解析结果,因此您不需要res.json()更长时间.

对于第二次map在新verions RxJS正在使用另一种方式.它现在是可管理的,你需要结合使用它pipe.

import { Injectable } from "@angular/core";
import { HttpClient} from "@angular/common/http";

@Injectable()    
export class DataService {
  constructor(public httpClient: HttpClient) {}

  getData() {
    return this.httpClient
               .get("https://jsonplaceholder.typicode.com/users")
  }
}

使用map运算符

import { map } from 'rxjs/operators';

...

someFunction() {
   this.httpClient.get("https://jsonplaceholder.typicode.com/users")
                  .pipe(map(res) => something with res);
}

...

Answer 2

在 RXJS 6 import { map } from 'rxjs/operators';

import { map } from 'rxjs/operators';
getData() {
   return this.http.get("https://jsonplaceholder.typicode.com/users")
   .pipe(
        map(res => res.json())
    );
}