angular: Component Router does not work with Upgrade Adapter

When trying to use the Angular 2 Component Router (Angular 2 RC 4) with the upgrade adapter I got the following error:

Bootstrap at least one component before injecting Router. at setupRouter

This is my main.ts file:

angular.module(moduleName).directive('App', upgradeAdapter.downgradeNg2Component(AppComponent));

upgradeAdapter.addProvider(APP_ROUTER_PROVIDERS);

upgradeAdapter.bootstrap(document.body, [moduleName]);

I google the problem and found the following links, but they all correspond to the router deprecated module as the Angular team changed how the router works since RC4:

https://github.com/angular/angular/issues/7147?_pjax=%23js-repo-pjax-container

Any ideas?

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 15 (6 by maintainers)

Commits related to this issue

feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago
feat(router): Added token for router primary component Allows the router primary component to be overriden when using ngUpgrade. Closes #9870, #8463, #9973 — committed to brandonroberts/angular by brandonroberts 8 years ago

Most upvoted comments

@ptomaszi provideRouter is being deprecated as of RC5, so as a disclaimer this is subject to change but since you’re using ngUpgrade, you’ll need to override the ApplicationRef in the providers of your AppComponent

Plunker: http://plnkr.co/edit/vpLkEY?p=preview

brandonroberts on Jul 8, 2016

"@angular/router": "3.1.1" doesn’t call initial navigation automatically.

Calling initialNavigation() in AppComponent fixed the issue:

...
export class AppComponent {
  constructor(router: Router) {
    router.initialNavigation();
  }
}

dezoxel on Nov 26, 2016