javascript - Angular2 RxJS får felet 'Observable_1.Observable.fromEvent är inte en funktion'

Jag använder AngularJS 2 Beta 0 och försöker skapa ett RxJS Observable från ett event på ett fönsterobjekt. Jag tror att jag känner till formeln för att fånga eventet som ett Observable i min tjänst:

var observ = Observable.fromEvent(this.windowHandle, 'hashchange');

Problemet är att varje gång jag försöker köra den här koden får jag ett felmeddelande som säger att 'fromEvent' inte är en funktion.

Uncaught EXCEPTION: Error during evaluation of "click"
ORIGINAL EXCEPTION: TypeError: Observable_1.Observable.fromEvent is not a function

Detta verkar antyda för mig att jag inte hanterar min import korrekt nu när RxJS inte ingår i byggnaden av Angular 2, även om resten av min applikation fungerar som den ska, vilket för mig betyder att RxJS är där det ska vara.

Min import i tjänsten ser ut så här:

import {Observable} from 'rxjs/Observable';

Även om jag också har försökt använda detta istället (med de lämpliga ändringarna i koden), med samma resultat:

import {FromEventObservable} from 'rxjs/observable/fromEvent';

Jag har följande konfiguration i min Index.html:

<script>
    System.config({
        map: {
            rxjs: 'node_modules/rxjs'
        },
        packages: {
            'app': {defaultExtension: 'js'},
            'rxjs': {defaultExtension: 'js'}
        }
    });
    System.import('app/app');
</script>

Kan någon säga till mig vad jag gör fel?

Svar #1

Det är definitivt inte nödvändigt att importera alla operatörer på en gång! Du importerade bara fromEvent fel. Du skulle kunna göra det så här:

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/fromEvent';

REDIGERA: Utöver det jag redan skrev: tree-shaking med AoT-kompilatorn i Angular tar bort oanvänd kod, baserat på vad du importerar. Om du bara importerar några objekt eller funktioner från rxjs/rx kan kompilatorn inte ta bort något. Importera alltid bara det du behöver!

Svar #2

Problemet verkade vara att import-satsen borde se ut så här:

import {Observable} from 'rxjs/Rx';

Observera att Observable tas in från rxjs/Rx istället för från rxjs/Observable. Som @EricMartinez nämner kommer det att automatiskt ge dig alla operatorer (som .map()) om du hämtar det på detta sätt.

Relaterade artiklar