1

Attempting upgrade to 2.0.0-rc.5 using Router at 3.0.0-rc.1.

I have followed the upgrade instructions from the documentation (moving from RC4 which is working fine for me). I am getting this error, no idea what's going on:

Unhandled Promise rejection: Bootstrap at least one component before injecting Router.

Zone: <root> ; Task: Promise.then ; Value: Error: Bootstrap at least one component before injecting Router.
at     setupRouter     node_modules/@angular/router/src/common_router_providers.js:21:15)
at NgModuleInjector .get (AppModule .ngfactory .js:227:57)
at NgModuleInjector .AppModuleInjector .createInternal (AppModule .ngfactory .js:309:55)
at NgModuleInjector .create

/node_modules/@angular/core/src/linker/ng_module_factory .js:91:76)
at NgModuleFactory .create /node_modules/@angular/core/src/linker/ng_module_factory .js:75:18)
/node_modules/@angular/core/src/application_ref .js:341:43)
at ZoneDelegate .invoke 
/node_modules/zone .js/dist/zone .js:323:29)
at Object .onInvoke 
node_modules/@angular/core/src/zone/ng_zone_impl.js:53:41)
at ZoneDelegate
/node_modules/zone.js/dist/zone .js:322:35)
at Zone.run /node_modules/zone .js/dist/zone .js:216:44)
NathanOliver
  • 171,901
  • 28
  • 288
  • 402
lcurrens
  • 29
  • 4
  • Add some code, add how your main `NgModule` looks like. Have you added bootstrap component? – Madhu Ranjan Aug 11 '16 at 18:21
  • OK seems the problem was injecting Router into constructor of some existing components, removed the injection and error went away. – lcurrens Aug 11 '16 at 18:23
  • I have same error, but no component or service in my code base injects Router into it's constructor :( – ulfryk Sep 06 '16 at 07:18

1 Answers1

3

ISSUE: https://github.com/angular/angular/issues/11660

SOLUTION: When you injecting router into services which needs router, something like this

@NgModule({
    imports : [
        BrowserModule
    ],
    providers : [
        {
        provide : Http,
        useFactory: (
            xhrBackend: XHRBackend, 
            requestOptions: RequestOptions,
            router: Router, <-- our problem
            constantsService:ConstantsService, 
            loaderComponentHelper: LoaderComponentHelper
        ) => new HttpInterceptor(xhrBackend, requestOptions, router, constantsService, loaderComponentHelper),
        deps: [XHRBackend, RequestOptions, Router, ConstantsService, LoaderComponentHelper],
    },
    {
        provide : AuthHttp, 
        useFactory: (http: Http, authService: AuthService, constantsService: ConstantsService) => {
            return new AuthHttp(http, authService, constantsService);
        },
        deps : [Http, AuthService, ConstantsService]
    }]
})

use Injector, just pass it into constructor and then define it inside

import {Injector} from '@angular/core'; 

this.router = this.injector.get(Router);

but don't do this in constructor

mutant_america
  • 738
  • 6
  • 18