A propriedade ‘map’ não existe no tipo ‘Observable ‘

Estou tentando chamar uma API do Angular, mas estou recebendo este erro:

Property 'map' does not exist on type 'Observable'

As respostas dessa pergunta semelhante não resolveram meu problema: Angular 2 beta.17: a propriedade ‘map’ não existe no tipo ‘Observable ‘ .

Estou usando o Angular 2.0.0-beta.17.

Você precisa importar o operador do map :

 import 'rxjs/add/operator/map' 

Ou mais geralmente:

 import 'rxjs/Rx'; 

Aviso: Para as versões do RxJS 6.xx e acima, você terá que usar operadores de tubulação, como mostrado no snippet de código abaixo:

 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); }); } } 

Isto é causado pela equipe de RxJS removendo o suporte para uso. Veja as mudanças de quebra no changelog do RxJS para mais informações.

Do changelog:

operadores : Os operadores pipeable devem agora ser importados de rxjs da seguinte forma: import { map, filter, switchMap } from 'rxjs/operators'; . Nenhuma importação profunda.

Revisitando isso porque minha solução não está listada aqui.

Estou executando o Angular 6 com o rxjs 6.0 e corri para esse erro.

Aqui está o que eu fiz para consertar isso:

eu mudei

 map((response: any) => response.json()) 

simplesmente ser:

 .pipe(map((response: any) => response.json())); 

Eu encontrei a correção aqui:

https://github.com/angular/angular/issues/15548#issuecomment-387009186

Espero que ajude.

Eu tive o mesmo problema com o Angular 2.0.1 porque eu estava importando Observable from

 import { Observable } from 'rxjs/Observable'; 

Eu resolvo meu problema na importação Observável deste caminho

 import { Observable } from 'rxjs'; 

apenas escreva este comando no terminal de código do seu projeto e reinicie o projeto.

 npm install rxjs-compat 

Você precisa importar o operador do map escrevendo isto:

 import 'rxjs/add/operator/map'; 

Em rxjs 6 o uso do operador de mapa foi alterado agora, você precisa usá-lo desta forma.

 import { map } from 'rxjs/operators'; myObservable .pipe(map(data => data * 2)) .subscribe(...); 

Para referência https://www.academind.com/learn/javascript/rxjs-6-what-changed/#operators-update-path

No meu caso, não seria suficiente include apenas mapa e promise:

 import 'rxjs/add/operator/map'; import 'rxjs/add/operator/toPromise'; 

Eu resolvi este problema importando vários componentes do rxjs como a documentação oficial recomenda:

1) Importe instruções em um arquivo app / rxjs-operators.ts:

 // import 'rxjs/Rx'; // adds ALL RxJS statics & operators to Observable // See node_module/rxjs/Rxjs.js // Import just the rxjs statics and operators we need for THIS app. // Statics import 'rxjs/add/observable/throw'; // Operators import 'rxjs/add/operator/catch'; import 'rxjs/add/operator/debounceTime'; import 'rxjs/add/operator/distinctUntilChanged'; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/switchMap'; import 'rxjs/add/operator/toPromise'; 

2) Importe o próprio operador rxjs em seu serviço:

 // Add the RxJS Observable operators we need in this app. import './rxjs-operators'; 

Estou usando o Angular 5.2 e quando uso import 'rxjs/Rx'; ele me lança o seguinte erro de fiapos: TSLint: Esta importação está na lista negra, importe um submódulo (import-blacklist)

Veja a imagem abaixo: Importação de rxjs / Rx está na lista negra em Angular 5.2

SOLUÇÃO: Resolvi isso importando apenas os operadores que eu precisava . Exemplo a seguir:

 import 'rxjs/add/operator/map'; import 'rxjs/add/operator/catch'; 

Portanto, a correção seria importar especificamente apenas os operadores necessários.

Eu tive o mesmo problema, eu estava usando o Visual Studio 2015, que tinha uma versão mais antiga do typescript.

Depois de atualizar a extensão, o problema foi resolvido.

Baixar link

Eu também enfrentei o mesmo erro. Uma solução que funcionou para mim foi adicionar as seguintes linhas no seu arquivo service.ts em vez de import 'rxjs/add/operator/map' :

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

Por exemplo, meu app.service.ts após a debugging era como,

 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 { return this.http.get('https://samples.openweathermap.org/data/2.5/history/city?q=Warren,OH&appid=b6907d289e10d714a6e88b30761fae22') .pipe(map(result => result)); } } 

Eu tentei todas as respostas possíveis postadas acima, nenhuma delas funcionou,

Eu resolvi isso simplesmente reiniciar meu IDE ou seja, o Visual Studio Code

Que ajude alguém.

para todos os usuários do Linux que estão tendo este problema, verifique se a pasta rxjs-compat está bloqueada. Eu tive esse mesmo problema e eu fui no terminal, usei o sudo su para dar permissão para toda a pasta rxjs-compat e foi corrigido. Isso é supondo que você importou

 import 'rxjs/add/operator/map'; import 'rxjs/add/operator/catch'; 

no arquivo project.ts onde ocorreu o erro .map original.

Use a function map na function pipe e isso resolverá seu problema. Você pode verificar a documentação aqui .

 this.items = this.afs.collection('blalal').snapshotChanges().pipe(map(changes => { return changes.map(a => { const data = a.payload.doc.data() as Items; data.id = a.payload.doc.id; return data; }) }) 

Se depois de importar importação ‘rxjs / add / operator / map’ ou importar ‘rxjs / Rx’ também você está recebendo o mesmo erro, em seguida, reinicie o editor de código do visual studio, o erro será resolvido.

npm instalar rxjs @ 6 rxjs-compat @ 6 –save