Solución a los errores con Rxjs y novedades en Angular 6

En este tutorial aprenderemos a solucionar los problemas con RXJS en Angular 6.

Nos podemos encontrar varias situaciones en las que podemos tener errores con rxjs.

Proyecto con versión anterior o uso de imports clásicos

Si acabamos de actualizar un proyecto completo de Angular en una versión anterior a la versión 6, es común que podamos tener un error.

En Angular 6 al importar Observable en nuestros servicios:

import { Observable } from 'rxjs/Observable';

Puede ser que nos devuelva un error por la consola de comandos, algo como esto:

ERROR in node_modules/rxjs/Observable.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Observable'.

Para solucionarlo tenemos que cortar la ejecución de nuestro servidor local de desarrollo de Angular pulsando Ctrl+C y ejecutamos este comando para instalar una libreria que falta:

npm install --save rxjs-compat

Después arrancamos de nuevo nuestro proyecto de Angular con el comando:

ng serve

y con esto todo estará listo y funcionando.

HttpModule

Cuando usamos el HttpModule en Angular 6, puede que te genere algún fallo la librería map, importala de esta manera en tu servicio:

import {map} from 'rxjs/operators'; 

Y usala de esta manera:

.pipe(map(res => res.json())); 

Y de esta manera podemos usar HttpModule en Angular 6.

HttpClient

Cuando usamos el HttpClient y el Observable en Angular 6, normalmente importábamos la libreria así:

import { Observable } from 'rxjs/Observable';

Pero ahora para evitar errores, tambien podemos hacerlo así:

import { Observable } from 'rxjs';

Y con esto ya sabemos como solucionar los errores con rxjs, observables, etc en Angular 6 fácilmente 🙂

Víctor Robles WEB

Autor: Victor

Desarrollador web - Formador online - Blogger

Compartir este post

2 Comentarios

  1. FUNCIONAAAAAA.. !!!

    Gracias hermano, luego de un npm update me pasó que no encontraba el rxjs para los observers, segui tus pasos y funcionó.

    Gracias.

    Responder
  2. Excelente, despues de escribir mi codigo de esta manera funciono:

    import { Observable } from ‘rxjs’;

    Responder

Poner un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *