typescript - tipo - property map does not exist on type observable response angular 6

Angular 2 beta.17: la propiedad ''map'' no existe en el tipo ''Observable<Response>''

Question

Acabo de actualizar de Angular 2 beta16 a beta17 , que a su vez requiere rxjs 5.0.0-beta.6. (Registro de cambios aquí: https://github.com/angular/angular/blob/master/CHANGELOG.md#200-beta17-2016-04-28 ) En beta16 todo funcionaba bien con respecto a la funcionalidad Observable / mapa. Los siguientes errores aparecieron después de que actualicé y ocurren cuando el mecanografiado intenta transpilar:

1. La propiedad ''mapa'' no existe en el tipo ''Observable'' (en cualquier lugar donde haya usado un mapa con un observable)
2. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): error TS2435: Los módulos ambientales no pueden anidarse en otros módulos o espacios de nombres.
3. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): error TS2436: La declaración del módulo ambiental no puede especificar un nombre de módulo relativo.

He visto esta pregunta / respuesta pero no resuelve el problema: errores observables con Angular2 beta.12 y RxJs 5 beta.3

Mi appBoot.ts tiene este aspecto (ya estoy haciendo referencia a rxjs / map):

///<reference path="./../node_modules/angular2/typings/browser.d.ts"/>
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
]);

¿Alguien tiene alguna idea de lo que se está volviendo loco?

Answer 1

LA RESPUESTA FINAL PARA LOS QUE UTILIZAN ANGULAR 6:

Agregue el siguiente comando en su archivo * .service.ts "

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

Estoy usando Windows 10;

angular6 con mecanografiado V 2.3.4.0

Answer 2

En angular 2x

En example.component.ts

import { Observable } from ''rxjs'';

En example.component.html

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

En Angular 5x o Angular 6x:

En example.component.ts

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

En example.component.html

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

Answer 3

Actualicé mi complemento gulp-typescript a la última versión (2.13.0) y ahora se compila sin problemas.

ACTUALIZACIÓN 1: anteriormente estaba usando gulp-typescript versión 2.12.0

ACTUALIZACIÓN 2: Si está actualizando a Angular 2.0.0-rc.1, debe hacer lo siguiente en su archivo appBoot.ts:

///<reference path="./../typings/browser/ambient/es6-shim/index.d.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
]);

Lo importante es la referencia a es6-shim / index.d.ts

Esto supone que ha instalado los tipos de es6-shim como se muestra aquí:

Más información sobre la instalación de tipings desde Angular aquí: https://angular.io/docs/ts/latest/guide/typescript-configuration.html#!#typings

Answer 4

Aparecerán mensajes de error similares al pasar de la versión 5 a la 6. Aquí hay una respuesta para el cambio a rxjs-6.

Importe los operadores individuales, luego use pipe lugar de encadenar.

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

Answer 5

Como Justin Scofield ha sugerido en su respuesta, para el último lanzamiento de Angular 5 y para Angular 6, a partir del 1 de junio de 2018, solo import ''rxjs/add/operator/map''; no es suficiente para eliminar el error TS: [ts] Property ''map'' does not exist on type ''Observable<Object>''.

Es necesario ejecutar el siguiente comando para instalar las dependencias requeridas: npm install rxjs@6 rxjs-compat@6 --save después de lo cual se resuelve el error de dependencia de importación de map !

Answer 6

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 recomienda la documentación oficial :

1) Importar declaraciones en un archivo app / rxjs-operator.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 el operador rxjs en tu servicio:

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

Answer 7

Estaba enfrentando el error similar. Se resolvió cuando hice estas tres cosas:

1. Actualice a los últimos rxjs:

   npm install rxjs@6 rxjs-compat@6 --save

2. Importar mapa y promesa:

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

3. Se agregó una nueva declaración de importación:

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

Answer 8

Necesita importar el operador del map :

import ''rxjs/add/operator/map''

Answer 9

Parece que el último RxJS requiere el mecanografiado 1.8, por lo que el mecanografiado 1.7 informa el error anterior.

Resolví este problema actualizando a la última versión mecanografiada.

Answer 10

Rxjs 5.5 “La propiedad ''mapa'' no existe en el tipo Observable.

El problema estaba relacionado con el hecho de que necesita agregar tubería alrededor de todos los operadores.

Cambia esto,

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

a esto

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

Y

Importar mapa como este,

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

Resolverá tus problemas.

Answer 11

Según tengo entendido, se debe a la última actualización de rxjs . Han cambiado algunos operadores y sintaxis. A partir de entonces, deberíamos importar operadores rx como este

import { map } from "rxjs/operators";

en lugar de esto

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

Y necesitamos agregar tubería alrededor de todos los operadores como este

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

La fuente está here

Answer 12

Si está utilizando angular4, utilice el siguiente importación. deberia de funcionar .

importar ''rxjs / add / operator / map'';

Si está usando angular5 / 6, use el mapa con tubería e importe debajo de uno

importar {mapa} desde "rxjs / operadores";

Answer 13

Si ve este error en VS2015, hay un problema de github y solución mencionada aquí:

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

Esto me ayudó a resolver que el property map does not exist on observable problema property map does not exist on observable . Además, asegúrese de tener la versión mecanografiada anterior a 1.8.2

Answer 14

ACTUALIZACIÓN 29 de septiembre de 2016 para Angular 2.0 Final y VS 2015

La solución ya no es necesaria, para solucionarlo solo necesita instalar TypeScript versión 2.0.3 .

Arreglo tomado de la edición en https://github.com/Microsoft/TypeScript/issues/8518#issuecomment-229506507 .

Answer 15

la propiedad ''mapa'' no existe en el tipo ''respuesta observable'' angular 6

Solución: actualice la CLI angular y la versión principal

ng update @angular/cli //Update Angular CLi
ng update @angular/core //Update Angular Core
npm install --save rxjs-compat //For Map Call For Post Method 

Answer 16

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

Y

npm install rxjs@6 rxjs-compat@6 --save

trabajó para mi