I am integrating ui-router2 with angular2-rc-4 but i am getting
Error: Invalid provider – only instances of Provider and Type are allowed, got: [object Object]
Following is the bootstraping code
import {trace, UIROUTER_PROVIDERS, UIView, UIRouterConfig, Category, UIROUTER_DIRECTIVES} from "ui-router-ng2"; import {HTTP_PROVIDERS} from "@angular/http"; import {provide, PLATFORM_DIRECTIVES} from "@angular/core"; import {LocationStrategy, HashLocationStrategy, PathLocationStrategy, PlatformLocation} from "@angular/common"; import {BrowserPlatformLocation} from '@angular/platform-browser'; import 'rxjs/add/operator/toPromise'; import 'rxjs/add/operator/map'; import { APP_BASE_HREF } from '@angular/common'; import { disableDeprecatedForms, provideForms } from '@angular/forms'; import { enableProdMode } from '@angular/core'; import { bootstrap } from '@angular/platform-browser-dynamic'; import { InitialStates } from './app.routes'; import { AppComponent } from './app.component'; import {MyUIRouterConfig} from "./_bootstrap/router.config"; if ('' === 'prod') { enableProdMode(); } trace.enable(Category.TRANSITION, Category.VIEWCONFIG); bootstrap(UIView, [ disableDeprecatedForms(), provideForms(), InitialStates, { provide: APP_BASE_HREF, useValue: '' }, provide(LocationStrategy, { useClass: HashLocationStrategy }), provide(LocationStrategy, { useClass: PathLocationStrategy }), provide(PlatformLocation, { useClass: BrowserPlatformLocation }), ...UIROUTER_PROVIDERS, ...HTTP_PROVIDERS, provide(UIRouterConfig, { useClass: MyUIRouterConfig }), provide(PLATFORM_DIRECTIVES, {useValue: [UIROUTER_DIRECTIVES], multi: true}) ]);
Following is my router config.
import {UIRouter} from "ui-router-ng2";
import {InitialStates} from "../app.routes";
import {Injectable, Injector} from "@angular/core";
@Injectable()
export class MyUIRouterConfig {
constructor(private injector: Injector) {}
configure(uiRouter: UIRouter) {
// Register each state definition (from app.states.ts) with the StateRegistry
InitialStates.forEach(state => uiRouter.stateRegistry.register(state));
// Define a default behavior, for when the URL matched no routes
uiRouter.urlRouterProvider.otherwise(() => uiRouter.stateService.go("app", null, null) && null);
}
}
Best Answer
The same error is thrown for a simple typo, if you write this:
Instead of this:
Note the difference between
provider
andprovide
. The correct isprovide
.Hope this helps.