我试图从Angular调用一个API,但得到这个错误:

属性“map”在类型“Observable<Response>”上不存在

这个类似问题的答案并没有解决我的问题:Angular 2 beta版。17:属性“map”在类型“Observable<Response>”上不存在。

我使用的是Angular 2.0.0-beta.17。


当前回答

我也曾犯过同样的错误。一个对我有效的解决方案是在您的服务中添加以下行。Ts文件而不是导入'rxjs/add/operator/map':

import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

举个例子,我的app。service。ts在调试之后,

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable()
export class AppService {
    constructor(private http: HttpClient) {}
    getData(): Observable<any> {
        return this.http.get('https://samples.openweathermap.org/data/2.5/history/city?q=Warren,OH&appid=b6907d289e10d714a6e88b30761fae22')
        .pipe(map(result => result));
    }
}

其他回答

在angular的新版本的httpClient模块中,你还没有这样写:

return this.http.request(request)
      .map((res: Response) => res.json());

但你可以这样做:

return this.http.request(request)
             .pipe(
               map((res: any) => res.json())
             );

你需要导入map操作符:

import 'rxjs/add/operator/map'

或者更一般地说:

import 'rxjs/Rx';

注意:对于RxJS 6.x版本。X和以上,你将必须使用可管道的操作符,如下面的代码片段所示:

import { map } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';

// ...
export class MyComponent {
  constructor(private http: HttpClient) { }
  getItems() {
    this.http.get('https://example.com/api/items').pipe(map(data => {})).subscribe(result => {
      console.log(result);
    });
  }
}

这是由于RxJS团队删除了对使用的支持 更多信息请参见RxJS更新日志中的重大更改。

更新日志如下:

operator:可管道操作符现在必须像这样从rxjs中导入:import {map, filter, switchMap} from 'rxjs/operators';没有深度进口。

我在Angular 2.0.1中也遇到了同样的问题,因为我从

import { Observable } from 'rxjs/Observable';

我解决了从这个路径导入Observable的问题

import { Observable } from 'rxjs';

angular的新版本不支持.map,你必须通过cmd安装 保存rxjs-compat 通过这个你可以享受老技术。 注意: 不要忘记导入这些行。

import { Observable, Subject } from 'rxjs';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

我有同样的问题,我解决它如下

import { map } from 'rxjs/operators'; // imports statement 

return this.auth.user$.pipe(
  map(user =>{
    if(user) return true;
        this.router.navigate(['/login'], { queryParams: {returnUrl :state.url}});
    return false;
  }));
}

有一个问题,可观察类型是空的,所以我添加类型任何,它有助于清除许多错误

user$: Observable<firebase.User | any>;