Omar
Omar

Reputation: 3030

Angular Universal RxJs "Observable_1.Observable.throw is not a function"

I am getting the following error on the universal server console log (only with SSR not ng serve)

ERROR TypeError: Observable_1.Observable.throw is not a function

Here is how my service is set up

import { Injectable, Injector } from '@angular/core';
import { HttpClient, HttpParams, HttpErrorResponse } from '@angular/common/http';
import { Headers, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { Subject, from } from 'rxjs';
import 'rxjs/add/observable/throw';


@Injectable()
export class BcProductService {

    constructor(
        private http: HttpClient,
        private configsService: ConfigsService,
        private injector: Injector
    ) {}

    getProductById(product_id) {
        const data = { product_id: product_id };
        return this.http.get<any>('/getProductById', { params: data }).catch(err => this.errHandler(err));
    }

    errHandler(error: HttpErrorResponse) {
        console.error(error);
        return Observable.throw(error.error || "unknown error");
    }

}

*** I am subscribing to getProductById() in another component.

All over the internet I see ppl are forgetting import 'rxjs/add/observable/throw'; but i have that and the error only happens during server-side rendering. Am I importing the wrong Observable?

Versions

rxjs 6.3.2 Angular CLI: 6.2.4 Node: 9.2.0 OS: darwin x64 Angular: 6.1.7 rxjs-compat: ^6.3.3

Upvotes: 1

Views: 1056

Answers (1)

Suresh Kumar Ariya
Suresh Kumar Ariya

Reputation: 9764

As of RxJS 6, you need to use throwError instead of throw.

import { throwError } from 'rxjs';

errHandler(error: HttpErrorResponse) {
    console.error(error);
    return Observable.throwError(error.error || "unknown error");
}

Package.json:

"rxjs": "6.3.2",
"rxjs-compat": "6.2.2",

Note: carot(^) symbol is not used. Delete package.lock.json file and do 'npm install'.

Upvotes: 1

Related Questions