Angular 2 beta.17: la ‘mappa’ di proprietà non esiste sul tipo ‘Observable ‘

Ho appena aggiornato da Angular2 beta16 a beta17, che a sua volta richiede rxjs 5.0.0-beta.6. (Changelog qui: https://github.com/angular/angular/blob/master/CHANGELOG.md#200-beta17-2016-04-28 ) In beta16 tutto funzionava bene per quanto riguarda la funzionalità Observable / map. I seguenti errori sono apparsi dopo l’aggiornamento e si verificano quando il typescript tenta di eseguire il trasp:

  1. La ‘mappa’ di proprietà non esiste sul tipo ‘Osservabile’ (ovunque io abbia usato la mappa con un osservabile)
  2. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): errore TS2435: i moduli Ambient non possono essere nidificati in altri moduli o spazi dei nomi.
  3. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): errore TS2436: la dichiarazione del modulo Ambient non può specificare il nome del modulo relativo.

Ho visto questa domanda / risposta ma non risolve il problema: errori osservabili con Angular2 beta.12 e RxJs 5 beta.3

La mia appBoot.ts ha questo aspetto (sto già facendo riferimento a rxjs / map):

/// import {bootstrap} from "angular2/platform/browser"; import {ROUTER_PROVIDERS} from 'angular2/router'; import {HTTP_PROVIDERS} from 'angular2/http'; [stuff] import 'rxjs/add/operator/map'; import 'rxjs/add/operator/toPromise'; import {enableProdMode} from 'angular2/core'; import { Title } from 'angular2/platform/browser'; //enableProdMode(); bootstrap(AppDesktopComponent, [ ROUTER_PROVIDERS, HTTP_PROVIDERS, Title ]); 

Qualcuno ha idea di cosa sta andando in tilt?

Devi importare l’operatore della map :

 import 'rxjs/add/operator/map' 

Ho aggiornato il mio plugin gulp-typescript alla versione più recente (2.13.0) e ora lo compilo senza intoppi.

AGGIORNAMENTO 1: In precedenza utilizzavo gulp-typescript versione 2.12.0

AGGIORNAMENTO 2: se si sta eseguendo l’aggiornamento a Angular 2.0.0-rc.1, è necessario eseguire quanto segue nel file appBoot.ts:

 /// import { bootstrap } from "@angular/platform-browser-dynamic"; import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; import { HTTP_PROVIDERS } from '@angular/http'; import { AppComponent } from "./path/AppComponent"; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/toPromise'; // import 'rxjs/Rx'; this will load all features import { enableProdMode } from '@angular/core'; import { Title } from '@angular/platform-browser'; //enableProdMode(); bootstrap(AppComponent, [ ROUTER_PROVIDERS, HTTP_PROVIDERS, Title ]); 

L’importante è il riferimento a es6-shim / index.d.ts

Questo presuppone che tu abbia installato le tipizzazioni di es6-shim come mostrato qui: inserisci la descrizione dell'immagine qui

Maggiori informazioni sull’installazione dei tipi da Angular qui: https://angular.io/docs/ts/latest/guide/typescript-configuration.html#!#typings

Rxjs 5.5 “Proprietà” mappa “non esiste sul tipo Osservabile.

Il problema era legato al fatto che è necessario aggiungere pipe a tutti gli operatori.

Cambia questo,

 this.myObservable().map(data => {}) 

a questa

 this.myObservable().pipe(map(data => {})) 

E

Importa mappa come questa,

 import { map } from 'rxjs/operators'; 

Risolverà i tuoi problemi.

Nel mio caso non basterebbe includere solo la mappa e promettere:

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

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

1) Importa le istruzioni in un file 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) Importa l’operatore rxjs stesso nel tuo servizio:

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

Se ti capita di vedere questo errore in VS2015, c’è un problema github e una soluzione qui menzionata:

https://github.com/Microsoft/TypeScript/issues/8518#issuecomment-229506507

Questo mi ha aiutato a risolvere la property map does not exist on observable problema property map does not exist on observable . Inoltre, assicurati di avere la versione typescript sopra 1.8.2

 import 'rxjs/add/operator/map'; 

&

npm install [email protected] [email protected] --save

ha funzionato per me

AGGIORNAMENTO 29 settembre 2016 per Angular 2.0 Final e VS 2015

La soluzione alternativa non è più necessaria, per risolvere il problema è sufficiente installare TypeScript versione 2.0.3 .

Risolto tratto dalla modifica di questo commento sul problema github .

In 2x angolari

In example.component.ts

 import { Observable } from 'rxjs'; 

In example.component.html

  Observable.interval(2000).map(valor => 'Async value'); 

In Angolare 5x o Angolare 6x:

In example.component.ts

 import { Observable, interval, pipe } from 'rxjs'; import {switchMap, map} from 'rxjs/operators'; 

In example.component.html

 valorAsync = interval(2500).pipe(map(valor => 'Async value')); 

Come ha suggerito Justin Scofield nella sua risposta, per l’ultima versione di Angular 5 e per Angular 6, come il 1 ° giugno 2018, è sufficiente import 'rxjs/add/operator/map'; non è sufficiente per rimuovere l’errore TS: [ts] Property 'map' does not exist on type 'Observable'.

È necessario eseguire il comando seguente per installare le dipendenze richieste: npm install [email protected] [email protected] --save dopo il quale viene risolto l’errore di dipendenza dell’importazione della map !

Sembra che l’ultimo RxJS richieda il typescript 1.8, quindi il typescript 1.7 riporta l’errore sopra riportato.

Ho risolto questo problema aggiornando all’ultima versione typescript.

LA RISPOSTA FINALE PER COLORO CHE UTILIZZA L’ANGOLARE 6:

Aggiungi il comando sotto nel tuo file * .service.ts

 import { map } from "rxjs/operators"; **********************************************Example**Below************************************** getPosts(){ this.http.get('http://jsonplaceholder.typicode.com/posts') .pipe(map(res => res.json())); } } 

Sto usando Windows 10;

angular6 con typescript V 2.3.4.0

Messaggi simili di errore appariranno quando si passa dalla versione 5 alla 6. Ecco una risposta per la modifica a rxjs-6.

Importa i singoli operatori, quindi utilizza la pipe anziché il concatenamento.

 import { map, delay, catchError } from 'rxjs/operators'; source.pipe( map(x => x + x), delay(4000), catchError(err => of('error found')), ).subscribe(printResult); 

Come ho capito è a causa dell’ultimo aggiornamento di rxjs . Hanno cambiato alcuni operatori e la syntax. Successivamente, dovremmo importare operatori rx come questo

import { map } from "rxjs/operators";

Invece di questo

 import 'rxjs/add/operator/map'; 

E abbiamo bisogno di aggiungere pipe a tutti gli operatori come questo

this.myObservable().pipe(map(data => {}))

La fonte è qui

Stavo affrontando l’errore simile. È stato risolto quando ho fatto queste tre cose:

  1. Aggiorna all’ultimo rxjs:

npm install [email protected] [email protected] --save

  1. Importa mappa e promuovi:

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

  2. Aggiunta una nuova dichiarazione di importazione:

import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';

Se stai usando angular4 l’uso sotto l’importazione. dovrebbe funzionare .

importare ‘rxjs / add / operator / map’;

Se si utilizza angular5 / 6, utilizzare map with pipe e importare sotto uno

importare {map} da “rxjs / operators”;