Rxjs: EXCEPTION: TypeError: observable_1.Observable.throw is not a function

[esakal]

Hello,
I'm trying to re-throw an observable from a catch function.

RxJS version:
rx: [email protected]
angular: 2.0.0-rc.4

Code to reproduce:

import 'rxjs/Observable';
import 'rxjs/add/observable/throw';

return login().catch((err) => {
                console.log(err);
                return Observable.throw(err);
 });

Expected behavior:
if the login fails I want to log the error and re-trhow it.

Actual behavior:
I'm getting the following error:

EXCEPTION: TypeError: observable_1.Observable.throw is not a function

Additional information:

• file throw.d.ts is empty (i don't know if it is relevant)
• everything else works (for example using 'map' function that also was added
• file throw.js has content:

"use strict";
var Observable_1 = require('../../Observable');
var throw_1 = require('../../observable/throw');
Observable_1.Observable.throw = throw_1._throw;
//# sourceMappingURL=throw.js.map

[jayphelps]

In the reproduction code you provided, you're not importing a reference to Observable?

import { Observable } from 'rxjs/Observable';
// INSTEAD of
import 'rxjs/Observable';

Is that just a typo in your reproduction or are you really missing that or you're importing Observable reference another way? How you're importing it is super important here, so definitely be clear 😄

[jayphelps]

If indeed you were missing it, it suggest to me that it was accessing some global version of Observable that isn't the same Observable that the throw() method is added to with 'rxjs/add/observable/throw' which might happen if you accidentally have two version of rxjs being bundled in with your app, one that's somewhere being made global and a different one you're importing here.

This is purely speculation though...hard to say without a runnable project cause what ever the problem is it sounds most likely packaging/importing related and not rxjs bug related.

[benlesh]

@jayphelps hit the nail on the head here. The Observable you're getting is one that's been included in core-js most likely (if you're using it). I'm not sure why it's in core-js, as the spec isn't close the finalization yet, but I suspect that's what you're hitting.

I'm closing this issue for now, as I think it's been resolved. Please reopen if this doesn't solve it, @esakal.

[NickAb]

I've got angular app and I get same TypeError, but for some reason Observable.throw works in one context, and does not in another.

Here is a code sample.

• If cardId is not empty and http request fails and handleError gets called, then return Observable.throw(error); // <= B in handleError works as expected.
• But if cardId is empty, then return Observable.throw('invalid'); // <= A in getCard fails with TypeError.

If I uncomment import 'rxjs/add/observable/throw';, then both cases will work as expected. But I do not understand why it works in one case, and does not in another inside same class.

import { Injectable } from '@angular/core';
import { Http, URLSearchParams, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
//import 'rxjs/add/observable/throw';

@Injectable()
export class CardsService {
    constructor(private readonly _http: Http) {
    }

    public getCard(cardId: string): Observable<ICardMatching> {
        if (!cardId) {
            return Observable.throw('invalid'); // <= A
        }

        return this._http.get(`/api/Cards/${cardId}`)
            .map(response => response.json())
            .catch(this.handleError);
    }

    private handleError(error: Response | any) {
        console.error(error);
        return Observable.throw(error); // <= B
    }
}

...

[realappie]

@javagose All of the operators excluding throw.

Im having the same problem, and Im importing the the observable like so

import { Observable } from 'rxjs/Observable';

For some reason, typescript is complaining about how it cannot find throw.

Property 'throw' does not exist on type 'Observable<never>'

Which is expected because the definition file of throw (throw.d.ts) is empty!
Importing throw from observables doesn't work either

import 'rxjs/add/observable/throw';

[jayphelps]

@realappie importing import { Observable } from 'rxjs/Observable'; alone, without any other code in your project at all, gives you that error?

If not, can you provide more details to reproduce?

[benlesh]

Apologies for deleting a few comments here

I've deleted a couple of comments that had a lot of :+1: on them that were advising people to use import { Observable } from 'rxjs/Rx'; This is dangerous advice, because doing so will import all of Rx, and will drastically increase your bundle size if you're using a bundler.

Two solutions:

1. Add import 'rxjs/add/observable/throw'; which will add the throw static method to Observable.
   
   
   
   • Only import { Observable } from 'rxjs/Observable'; thus insuring that you're only adding the operators you need.
   
   
   • Never import from rxjs/Rx, because it'll include every single operator, static method, scheduler, and utility that you probably don't need.
   
   
2. If you don't care about bundle size or parse time, import { Observable } from 'rxjs/Rx' and you'll get EVERYTHING. (You've been warned)

... apologies again to those whose comments I deleted. I just don't want people getting bad advice by landing here via search.