Búsqueda de sitios web

http - Métodos observables faltantes RxJS 5.0.0-beta.0

Estoy teniendo un problema al usar RxJS con Angular 2. La mayoría de los métodos sugeridos en el archivo de definición de TypeScript no están definidos en mi objeto Observable como...

Entonces descubrí que el método no existe en el prototipo de Observable.

Sé que muchas cosas cambiaron de la versión 4 a la 5, ¿así que me estoy perdiendo de algo?

Browserify lo agregó por mí...

Respuesta #1

Sin ver tu código real, no puedo decirte exactamente qué añadir para solucionarlo.

Pero el problema general es este: RxJS 5 ya no se incluye con Angular 2 ahora que ha entrado en la etapa Beta. Necesitarás importar los operadores que desees, o importarlos todos. Las declaraciones de importación se ven así:

import 'rxjs/add/operator/map'; // imports just map
import 'rxjs/add/operator/mergeMap'; // just mergeMap
import 'rxjs/add/operator/switchMap'; // just switchMap
import {delay} from 'rxjs/operator/delay'; // just delay

o como

import 'rxjs/Rx'; // import everything

Para determinar la ruta a tu módulo deseado, mira el árbol de origen. Cada importación con add agregará propiedades a Observable o Observable.prototype. Sin add, necesitarías hacer import {foo} from 'rxjs/path/to/foo'.

También necesitarás asegurarte de que RxJS se esté incorporando correctamente en el proyecto. Algo como esto iría en tu archivo index.html:

System.config({
    map: {
        'rxjs': 'node_modules/rxjs' // this tells the app where to find the above import statement code
    },
    packages: {
        'app': {defaultExtension: 'js'}, // if your app in the `app` folder
        'rxjs': {defaultExtension: 'js'}
    }
});
System.import('app/app'); // main file is `app/app.ts`

Si usas Webpack para construir la aplicación Angular 2 como en este proyecto de Github (como lo hice yo), entonces no necesitas esas cosas de System y las importaciones deberían hacerlo.

Respuesta #2

Sí, en Angular 2.0 tienes que incluir los operadores/observables que necesitas.

Lo hago así:

import 'rxjs/operator/map';
import 'rxjs/operator/delay';
import 'rxjs/operator/mergeMap';
import 'rxjs/operator/switchMap';
import 'rxjs/observable/interval';
import 'rxjs/observable/forkJoin';
import 'rxjs/observable/fromEvent';

Sin embargo, también necesitas configurar esto en System.js

System.config({
            defaultJSExtensions: true,
            paths: {
                'rxjs/observable/*' : './node_modules/rxjs/add/observable/*.js',
                'rxjs/operator/*' : './node_modules/rxjs/add/operator/*.js',
                'rxjs/*' : './node_modules/rxjs/*.js'
            }
        });

Aquí está el código funcionando: https://github.com/thelgevold/angular-2-samples

Artículos relacionados