Query string parameters are not available via the RouteParams instance.

When user visits URL like the http://example.com/path/part?queryParam=value, there is no access to the "queryParam" via RouteParams in the component that is configured to match the "/path/part" route.

When the RootRouter class calls to the navigate method in its constructor, it passes in as a parameter only the path part of a URL discarding all query string parameters.

You can get ahold of queryParam with <RouteParams>params.get('queryParam').

If this isn't working, please open a new issue that includes a reproduction showing the expected vs. actual behavior. Thanks!

It doesn't work after page refresh. This is part of the RootRouter::constructor()

this.navigate(location.path());

Thanks for closing!

Ah, I misunderstood.

Yes, I see the issue now.

fix(router): properly read and serialize query params

I'm on Beta.13 and this is still an issue. I have the following URL structure and I'm using HashLocationStrategy:

const Route(path: '/game/:owner/:name/players', component: PlayerManagementComponent, name: 'PlayerManagement')

When I use a [routerLink] it works fine. However when I refresh the page, I get the following error:
Route generator for 'owner' was not included in parameters passed.

Please re-open and address this issue.

+1 does not work for me on BETA 13 either.

Just a quick update. The problem that I was facing was different to the one mentioned in this issue. The problem was that the urlParams weren't available under certain circumstances. After further investigation, I found that it was indeed a piece of bad code (my own) that was causing this problem. I'm not affected by this issue.

@btford

@btford This does not work for me on beta 15:

GET http://localhost:8081/learn/cart/voucher?v=1234 (this will be a deep link from an email)

ngAfterContentInit(): void {
    console.log(this.routeParams)
    this.voucherCode = this.routeParams.get('v')
    console.log('Voucher code: ' + this.voucherCode)
}

Log (notice params is an empty object):
RouteParams {params: Object} params: Object__proto__: Object__proto__: Object
cartVoucherComponent.ts:69 Voucher code: null

I can use window.location.search but this should be supported by the framework.

I still have a similar issue: I get route params from the Router as I need one of them to add to a request header. This works fine when navigating through the application, but when I reload a page, The router state is just for route '/', and not the one I want to get to.....

EDIT: It seems that the Router.routerState.snapshot.root isn't updated before the resolves are started.

@dietergeerts

Am currently encountering similar issue @dietergeerts reported.

I have a work around, concerning preserving the parameters in your URL route only for @angular/router version 3.0.2. I realized that with @angular/router version 4.0.0 this hack sadly no longer works as the routing module will throw an error if it can't resolve the url - which it still doesn't recognize parameters or queries >;( .

Basically as long as you configured your server properly, on the app.component's load capture the URL in the constructor, you can implement the life cycle method AfterContentInit(), and properly redirect using the Router object's navigate method. This is obviously terribly inefficient and frustrating, especially if you have multiple routes with parameters...you'll end up writing your own custom routing table code.

Yep params are not recoverable... "ç!è§('é !!!!
So I'm facing this routing issue after "accidental" page refresh...
Any changes or improvements ? ...

I have something similar to this issue. When I reload I cannot get the route Params, they are undefined or NaN.

my route:

 path: 'mytools/Manage Access',
    component: AdminComponent,
    children: [
      {
        path: 'tenants',
        component: TenantsComponent,
        children: [
          { path: ':id/:displayName', component: DetailComponent }
        ]
      },

in component ngOnInit():

  this.route.params
        .subscribe(params => {
          const id = params['id'];
          const name = params['displayName'];

          console.log(id);
          console.log(name);
        })

I got undefined for both and my URL has both param in it. Happens on refresh of page F5.

@btford

@btford wondering why this is closed, if it is still an issue for many? Is there a workaround or fix? Thanks.

I lost so much time on it and eventually faced the following who made it clear:
https://stackoverflow.com/questions/42947133/parent-components-gets-empty-params-from-activatedroute

is there any solution for this issue

+1 should someone open a new issue?

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

Navigation Menu

Repository navigation

Query string parameters are not available via the RouteParams instance. #3957

5 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Query string parameters are not available via the RouteParams instance. #3957

Description

Activity

btford commented on Sep 9, 2015

peter-svintsitskyi commented on Sep 9, 2015

btford commented on Sep 9, 2015

5 remaining items

mofirouz commented on Apr 11, 2016

novabyte commented on Apr 11, 2016

mofirouz commented on Apr 14, 2016

matthewdenobrega commented on May 17, 2016

dietergeerts commented on Feb 8, 2017

osazemeu commented on Apr 13, 2017

Msnow90 commented on Apr 14, 2017

lostation commented on Aug 13, 2017

janega commented on Nov 15, 2017

janega commented on Nov 16, 2017

LironHazan commented on Feb 14, 2018

rukkumani commented on Jul 30, 2018

Splash34 commented on Apr 9, 2019

angular-automatic-lock-bot commented on Sep 14, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions