La 'mappa' della proprietà non esiste sul tipo 'Osservabile <Risposta>'

Sto provando a chiamare un'API da Angular ma visualizzo questo errore:

Property 'map' does not exist on type 'Observable<Response>'

Le risposte a questa domanda simile non hanno risolto il mio problema: Angular 2 beta.17: la 'mappa' delle proprietà non esiste sul tipo 'Osservabile <Risposta>' .

Sto usando Angular 2.0.0-beta.17.

Devi importare l' mapoperatore:

import 'rxjs/add/operator/map'

O più in generale:

import 'rxjs/Rx';

Avviso: per le versioni di RxJS 6.x.xe successive, dovrai utilizzare operatori pipeable come mostrato nello snippet di codice seguente:

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

Ciò è causato dal team di RxJS che rimuove il supporto per l'utilizzo. Per ulteriori informazioni, consultare le modifiche sostanziali nel log delle modifiche di RxJS.

Dal log delle modifiche:

operatori : gli operatori Pipeable devono ora essere importati da rxjs in questo modo: import { map, filter, switchMap } from 'rxjs/operators';. Nessuna importazione profonda.

Rivedere questo perché la mia soluzione non è elencata qui.

Sto eseguendo Angular 6 con rxjs 6.0 e ho riscontrato questo errore.

Ecco cosa ho fatto per risolverlo:

Ho cambiato

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

essere semplicemente:

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

Ho trovato la correzione qui:

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

basta scrivere questo comando nel terminale vs code del progetto e riavviare il progetto.

npm install rxjs-compat

Devi importare l' mapoperatore scrivendo questo:

import 'rxjs/add/operator/map';

Per Angular 7v

Modificare

import 'rxjs/add/operator/map';

Per

import { map } from "rxjs/operators"; 

E

 return this.http.get('http://localhost/ionicapis/public/api/products')
 .pipe(map(res => res.json()));

Ho avuto lo stesso problema con Angular 2.0.1 perché stavo importando Observable da

import { Observable } from 'rxjs/Observable';

Risolvo invece il mio problema con l'importazione di Observable da questo percorso

import { Observable } from 'rxjs';

In rxjs 6 l'utilizzo dell'operatore della mappa è stato modificato ora è necessario utilizzarlo in questo modo.

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

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

basta installare rxjs-compat digitando nel terminale:

npm install --save rxjs-compat

quindi importare:

import 'rxjs/Rx';

Nell'ultimo Angular 7. *. * , Puoi provare questo semplicemente come:

import { Observable, of } from "rxjs";
import { map, catchError } from "rxjs/operators";

E quindi puoi usarli methodscome segue:

   private getHtml(): Observable<any> {
    return this.http.get("../../assets/test-data/preview.html").pipe(
      map((res: any) => res.json()),
      catchError(<T>(error: any, result?: T) => {
        console.log(error);
        return of(result as T);
      })
    );
  }

Controlla questa demo per maggiori dettagli.

Nel mio caso non sarebbe sufficiente includere solo la mappa e la promessa:

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

Ho risolto questo problema importando diversi componenti rxjs come raccomandato dalla documentazione ufficiale :

1) Importare le istruzioni in un file app / rxjs-operatori.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) Importa rxjs-operator stesso nel tuo servizio:

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

import { map } from "rxjs/operators";

getGetFunction(){
this.http.get('http://someapi')
.pipe(map(res => res));
}

getPostFunction(yourPara){
this.http.get('http://someapi',yourPara)
.pipe(map(res => res));
}

Nella funzione sopra puoi vedere che non ho usato res.json () poiché sto usando HttpClient. Applica automaticamente res.json () e restituisce Observable (HttpResponse <stringa>). Non è più necessario chiamare questa funzione da soli dopo l'angolo 4 in HttpClient.

Ho avuto lo stesso problema, stavo usando Visual Studio 2015 che aveva una versione precedente di dattiloscritto.

Dopo aver aggiornato l'estensione, il problema è stato risolto.

Link per scaricare

Sto usando Angular 5.2 e quando lo uso import 'rxjs/Rx';mi lancia il seguente errore di lanugine: TSLint: questa importazione è nella lista nera, importa invece un sottomodulo (import-lista nera)

Vedi lo screenshot qui sotto:

SOLUZIONE: risolto importando solo gli operatori di cui avevo bisogno . L'esempio segue:

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

Quindi la soluzione sarebbe importare specificamente solo gli operatori necessari.

Installa semplicemente rxjs-compat per risolvere il problema

npm i rxjs-compat --save-dev

E importalo come di seguito

import 'rxjs/Rx';

Prima di tutto eseguire l'installazione come di seguito:

npm install --save rxjs-compat@6

Ora devi importare rxjsin service.ts:

import 'rxjs/Rx'; 

Ecco! Il problema e 'stato risolto.

semplicemente eseguirlo npm install --save rxjs-compatcorregge l'errore.

Si consiglia qui

Ho provato tutte le possibili risposte postate sopra nessuna di queste ha funzionato,

L'ho risolto semplicemente riavviando il mio IDE, ad esempio Visual Studio Code

Che possa aiutare qualcuno.

Anch'io ho affrontato lo stesso errore. Una soluzione che ha funzionato per me è stato quello di aggiungere le seguenti righe nei vostri service.ts il file invece di import 'rxjs/add/operator/map':

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

Ad esempio, il mio app.service.ts dopo il debug era come,

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

Se dopo aver importato import 'rxjs / add / operator / map' o importando 'rxjs / Rx' stai ottenendo lo stesso errore, riavvia l'editor di codice di Visual Studio, l'errore verrà risolto.

per tutti quegli utenti linux che hanno questo problema, controlla se la cartella rxjs-compat è bloccata. Ho avuto lo stesso identico problema e sono entrato nel terminale, ho usato sudo su per dare il permesso all'intera cartella rxjs-compat ed è stato risolto. Questo presuppone che tu abbia importato

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

nel file project.ts in cui si è verificato l'errore .map originale.

Utilizzare la mapfunzione in pipefunzione e risolverà il problema. Puoi consultare la documentazione qui .

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

npm installa rxjs @ 6 rxjs-compat @ 6 --save

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

  @Injectable({
  providedIn: 'root'
  })
  export class RestfulService {

  constructor(public http: Http) { }

 //access apis Get Request 
 getUsers() {
 return this.http.get('http://jsonplaceholder.typicode.com/users')
  .map(res => res.json());
  }

 }

eseguire il comando

 npm install rxjs-compat 

Ho appena importato

 import 'rxjs/add/operator/map';

riavvia il codice vs, problema risolto.

La nuova versione angolare non supporta .map, devi installarla tramite cmd npm install - salva rxjs-compat tramite questa che puoi goderti con la vecchia tecnica. nota: non dimenticare di importare queste righe.

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