CODEWITHSUNDEEP
angular
Vishal Anand
Vishal Anand

Reputation: 1481

Error: Invalid provider for the NgModule 'AppModule' - only instances of Provider and Type are allowed

I have this service:

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import { BaseUrl } from "../config/base-url.config";

enum HttpMethod {
    get,
    post,
    patch,
    put
}


@Injectable()
export class AdminHttpService<T> {
    baseUrl: string;

    constructor(private _http: Http, private _baseUrl: BaseUrl) {
        this.baseUrl = _baseUrl.getHttpBaseUrl();
    }

    getCollection(relativeUrl: string): Observable<T[]>;
    getCollection(relativeUrl: string, options: RequestOptions): Observable<T[]>;

    getCollection(relativeUrl: string, options?: RequestOptions): Observable<T[]> {
        return this.xhr(relativeUrl, HttpMethod.get, options);
    }

    get(relativeUrl: string): Observable<T>;
    get(relativeUrl: string, options: RequestOptions): Observable<T>;

    get(relativeUrl: string, options?: RequestOptions): Observable<T> {
        return this.xhr(relativeUrl, HttpMethod.get, options);
    }

    getJson(path): Observable<T> {
        return this._http.get(path)
            .map((resp: Response) => resp.json())
            .catch((error: any) => Observable.throw(error.json().error || 'Something went wrong!'));
    }

    create(relativeUrl: string, data: any, options?: RequestOptions): Observable<T> {
        return this.xhr(relativeUrl, HttpMethod.post, data, options);
    }

    private xhr(relativeUrl: string, httpMethod: HttpMethod, requestBody?: any, options?: RequestOptions): any {
        var requestUrl: string = this.baseUrl + relativeUrl;

        if (!options) {
            options = new RequestOptions({
                withCredentials: true
            });
        }

        switch (httpMethod) {

            case HttpMethod.get:
                return this._http.get(requestUrl, options)
                    .map((resp: Response) => resp.json())
                    .catch((error: any) => Observable.throw(error.json().error || 'Something went wrong!'));

            case HttpMethod.post:
                return this._http.post(requestUrl, requestBody, options)
                    .map((resp: Response) => resp.json())
                    .catch((error: any) => Observable.throw(error.json().error || 'Something went wrong!'));
        }

    }
}

After adding this service to the provider list of AppModule, I am getting following error:

Error: Invalid provider for the NgModule 'AppModule' - only instances of Provider and Type are allowed, got: [EventsService, MenuService, BaseUrl, ?undefined?] at SyntaxError.ZoneAwareError

AppModule is something like this:

,
  providers: [
    EventsService,
    MenuService,
    BaseUrl,
    AdminHttpService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Upvotes: 2

Views: 4282

Answers (1)

Vishal Anand
Vishal Anand

Reputation: 1481

After pulling my hairs apart I finally found the reason for the above error:

I have a barrel file which contains:

export * from '../../services/js-events/event.service';
export * from '../../services/menu/menu.service';
export * from '../../http/admin-http.service';
export * from '../../config/base-url.config';

Somehow following got duplicated and the application started throwing the mentioned error :( It was really hard to figure this one out!

export * from '../../http/admin-http.service';

So if your barrel file has duplicate export then this error might come. I do not know why this happens at this point in time. If anyone knows, please let me know. There must be a reason behind this.

Upvotes: 3

Related Questions