How to Access RouteParams in the App class in Angular2

I have an Angular2 application created using the CLI which I need to run in different modes. These modes need to be passed on the query string as the page will be hosted in an IFrame.

From what I have read I there is a problem accessing the RouteParams in the top level application as they are only available in a routed component.

currently I’m achieving what I want by going to the javascript location.search object but if possible I would prefer to do this in the correct dependency injected way so I can test things properly.

Can someone advise me the correct way to access the parameters.

@Component({
  selector: 'eox-app',
  providers: [ROUTER_PROVIDERS, RouteParams,
        FilterService,
        LoggingService,
        SpinnerService,
        StateService,
    ],
  templateUrl: 'app/eox.html',
  styleUrls: ['app//eox.css'],
  directives: [ROUTER_DIRECTIVES],
  pipes: []
})
@RouteConfig([

].concat(CliRouteConfig))

export class EoxApp {
    public menuItems = [
        { caption: 'Dashboard', link: ['DashboardRoot'] },
        { caption: 'Fonds', link: ['FundRoot'] },
        { caption: 'Logs', link: ['LogRoot'] },
        { caption: 'API', link: ['ApiRoot'] }
    ];

    public isEmbeded = false;
    constructor(
        private _router: Router,
        private _log: LoggingService,
        private _state: StateService,
        private _routeParams: RouteParams) {

        this.checkForEmbeded();
        let jwt = this.getCookie("eox-token");
        this._state.isAuthenticated = jwt === "123456";

        if(!this._state.isAuthenticated){
            this._log.log("Not authenticated", "Eox vNext");
            this._router.navigate(['DashboardRoot']);
        }
        else {
            this._log.log("Authenticated user", "Eox vNext");
        }
        if(this.isEmbeded && this._state.isAuthenticated)
         {
             this._log.log("Redirect to fundroot", "Eox vNext");
                this._router.navigate(['FundRoot']);
         }
    }

    getCookie(c_name) {
        var i, x, y, ARRcookies = document.cookie.split(';');
        for (i = 0; i < ARRcookies.length; i++) {
            x = ARRcookies[i].substr(0, ARRcookies[i].indexOf('='));
            y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
            x = x.replace(/^s+|s+$/g, "");
            if (x == c_name) {
                return unescape(y);
            }
        }
    }

    checkForEmbeded() {
        this.isEmbeded = location.search.indexOf("embeded") > 0;
        this._log.log("Embeded mode " + this.isEmbeded, "Eox vNext");
    }
}

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

You can inject the Router (like you already do), subscribe to it and then access the params like shown below:

 constructor(
        private _router: Router,
        private _log: LoggingService,
        private _state: StateService,
        private _routeParams: RouteParams) {
    this._router.subscribe(path => {
      console.debug(this._router.currentInstruction.component.params);
    });
}