El ‘mapa’ de propiedad no existe en el tipo ‘Observable ‘

Intento llamar a una API desde Angular pero obtengo este error:

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

Las respuestas de esta pregunta similar no resolvieron mi problema: Angular 2 beta.17: el ‘mapa’ de propiedad no existe en el tipo ‘Observable ‘ .

Estoy usando Angular 2.0.0-beta.17.

Necesita importar el operador del map :

 import 'rxjs/add/operator/map' 

O más en general:

 import 'rxjs/Rx'; 

Aviso: para las versiones de RxJS 6.xx y superiores, deberá usar operadores de pipeta como se muestra en el siguiente fragmento de código:

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

Esto se debe a que el equipo de RxJS está eliminando el soporte para usar. Consulte los cambios de última hora en el registro de cambios de RxJS para obtener más información.

Desde el registro de cambios:

Operadores : ahora los operadores que pueden extraerse de la pipeta se deben importar de la siguiente manera: import { map, filter, switchMap } from 'rxjs/operators'; . Sin importaciones profundas.

Revisando esto porque mi solución no está en la lista aquí.

Estoy ejecutando Angular 6 con rxjs 6.0 y encontré este error.

Esto es lo que hice para solucionarlo:

Cambié

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

simplemente ser:

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

Encontré la solución aquí:

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

Espero que ayude.

Tuve el mismo problema con Angular 2.0.1 porque estaba importando Observable de

 import { Observable } from 'rxjs/Observable'; 

Resuelvo mi problema al importar Observable desde esta ruta en su lugar

 import { Observable } from 'rxjs'; 

simplemente escriba este comando en el terminal de código vs de su proyecto y reinicie el proyecto.

 npm install rxjs-compat 

Necesita importar el operador del map escribiendo esto:

 import 'rxjs/add/operator/map'; 

En rxjs 6, el uso del operador del mapa se ha cambiado ahora, así que debe usarlo de esta manera.

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

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

En mi caso, no sería suficiente incluir solo el mapa y la promesa:

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

Resolví este problema importando varios componentes de rxjs como lo recomienda la documentación oficial :

1) Importar declaraciones en una aplicación / rxjs-operators.ts archivo:

 // 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) Importar rxjs-operator en su propio servicio:

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

Estoy usando Angular 5.2 y cuando uso la import 'rxjs/Rx'; me lanza el siguiente error de pelusa: TSLint: Esta importación está en la lista negra, importa un submódulo en su lugar (importación-lista negra)

Vea la captura de pantalla a continuación: La importación de rxjs / Rx está en la lista negra en Angular 5.2

SOLUCIÓN: Lo resolvió importando solo los operadores que necesitaba . El siguiente ejemplo:

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

Entonces la solución sería importar específicamente solo los operadores necesarios.

Tuve el mismo problema, estaba usando Visual Studio 2015, que tenía una versión anterior de typescript.

Después de actualizar la extensión, el problema se resolvió.

Enlace de descarga

Yo también enfrenté el mismo error. Una solución que funcionó para mí fue agregar las siguientes líneas en su archivo service.ts en lugar de import 'rxjs/add/operator/map' :

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

Por ejemplo, mi app.service.ts después de la depuración fue 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)); } } 

Intenté todas las posibles respuestas publicadas anteriormente, ninguna de ellas funcionó,

Lo resolví simplemente reiniciando mi IDE, es decir, código de Visual Studio

Puede ayudar a alguien

para todos aquellos usuarios de linux que tengan este problema, verifique si la carpeta rxjs-compat está bloqueada. Tuve exactamente este mismo problema y entré en la terminal, usé el sudo su para dar permiso a toda la carpeta rxjs-compat y fue corregido. Eso supone que importaste

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

en el archivo project.ts donde se produjo el error .map original.

Use la función de map en la función de pipe y resolverá su problema. Puede consultar la documentación aquí .

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

Si después de importar la importación ‘rxjs / add / operator / map’ o importar ‘rxjs / Rx’ también está obteniendo el mismo error luego reinicie su editor visual de código de estudio, el error será resuelto.

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

Simplemente instale rxjs-compat para resolver el problema

 npm i rxjs-compat --save-dev 

E importarlo como abajo

 import 'rxjs/Rx';