angulartypescriptangular2-routingtypescript1.7

RouteParams on bootstrap of app?


I've got a simple angular 2 app seed. A simple bootstrap;

bootstrap(App, [
    ROUTER_PROVIDERS,
    provide(LocationStrategy, {useClass: HashLocationStrategy})
]);

and App sets up a few routes;

@RouteConfig([
    {path: '/', component: Home, as: 'Home'},
    {path: '/login', component: Login, as: 'Login'}
])

Nothing fancy here. One of the things I do is OAuth2 login, which redirects away from the app, and then back, so what I wanted to do was pass in a query parameter on load. Something like http://localhost/#?token=123 Based on the errors I keep getting, and this: How to utilise URLSearchParams in Angular 2 it seems I can't just inject RouteParams into my constructor for App, because it's not being created by the router.

So how do I get query params on load? Do I really need to have App create an empty component (AppRoot or something) for the sole purpose of having it contain a router-outlet just so i can flow it through the router? That seems like a lot of unnecessary overhead.. anyone know of a better way?


Solution

  • Well, it turns out that you can't do this, so I had to cheat. My bootstrap now loads App, which just loads a single Route;

    @RouteConfig([
        {path: '/...', component: RootView, as: 'RootView', useAsDefault: true}
    ])
    export class App {
        constructor() {}
    }
    

    and then RootView can inject RouteParams as expected;

    export class RootView {
        constructor(routeParams: RouteParams) {
        }
    }
    

    This still feels horribly inelegant to me, if anyone has a better way, please do comment!