CODEWITHSUNDEEP
angularjsroutesangular
Guigui
Guigui

Reputation: 641

Angular 2 Router instantiation issue

I have an issue with the Angular 2 Router. I want basically to be able to navigate through my app with a function so I wanna use the navigate function from the Router, like in the official example.

So here is what I have in my files :

index.html

<script src='@routes.Assets.versioned("lib/typescript/lib/typescript.js")'></script>
<script src='@routes.Assets.versioned("lib/es6-shim/es6-shim.min.js")'></script>
<script src='@routes.Assets.versioned("lib/angular2/bundles/angular2-polyfills.js")'></script>
<script src='@routes.Assets.versioned("lib/angular2/es6/dev/src/testing/shims_for_IE.js")'></script>
<script src='@routes.Assets.versioned("lib/systemjs/dist/system.js")'></script>
<script src='@routes.Assets.versioned("lib/rxjs/bundles/Rx.js")'></script>
<script src='@routes.Assets.versioned("lib/angular2/bundles/angular2.dev.js")'></script>
<script src='@routes.Assets.versioned("lib/angular2/bundles/http.js")'></script>
<script src='@routes.Assets.versioned("systemjs.config.js")'></script>
<script src='@routes.Assets.versioned("lib/angular2/bundles/router.dev.js")'></script>

and in the typescript file where I want to use navigate :

import { Http } from "angular2/http"
import { Router } from "angular2/router"

export class ClassName {
  constructor (private _http: Http, private _router: Router) {}

  goSomewhere(pageName: string) {
      let link = [pageName]
      this._router.navigate(link)
  }
}

It's basically this, I tried to undo and add step by step, and the import worked and then it failed when adding it to the constructor, removing private or renaming the variable didn't work either.

On my imports I used to have angular2.js and router.js and got this issue :

angular2-polyfills.min.js:1 Error: EXCEPTION: Error during instantiation of t! (e -> t).

but I found here it could fix the issue by using the dev libs, but now I have this :

angular2-polyfills.min.js:1 Error: EXCEPTION: Error during instantiation of ApplicationRef_! (ApplicationRef -> ApplicationRef_).

Now I'm a bit lost... For information I'm using the beta 17 version of Angular 2.

Upvotes: 1

Views: 346

Answers (1)

Guigui
Guigui

Reputation: 641

So I found a way to make it work. We cannot use Router in a constructor of an @Injectable with no @RoutesConfig, so to keep the logic I wanted, I made this in my injectable class :

doSomething(router: Router, foo: any) {
    //instructions with set of link variable
    router.navigate(link)
}

and now I just have to add the injectable class and the router in all my components constructors and use _className.doSomething(this._router, foo) to use the function

Hope it will help some others :)

Upvotes: 1

Related Questions