1

I have this Angular 5 component that takes a parameter from the route url (the url is sent via mail to the user), and when this has been processed I would like to let the user do "other stuff" with the component. In order for the initial processing not be be repeated I would like to remove the parameter from the url, without reloading the page. Is this possible ?

So the routes look something like this :

    const appRoutes: Routes = [
        { path: 'mycomp', component: mycompComponent },
        { path: 'mycomp/:aparameter', component: mycompComponent }
    }

and the component picks the parameter up like this :

    constructor(private route: ActivatedRoute) {
        let myparam: string = route.snapshot.params["aparameter"];
    }
flipZomb
  • 13
  • 7
  • What *other stuff* is having a problem here? What is the scenario where *initial processing* might get repeated? – sabithpocker Mar 07 '18 at 13:29
  • scenario, is like this .... I send an email with a link. This link opens a parent component and one of it's child components takes the parameters from the URL and uses them to preset some fields on the form. User can now select something else on the parent and different data is shown. If the user goes back to the first child component it again pull the parameters from the URL. I realize I could prevent this by pulling data from url only in parent in the "ngOnInit", however this still leaves the URL looking "ugly". Would be nice to modify the URL once I have taken the parameter from it. – flipZomb Mar 07 '18 at 16:20
  • User goes back by hitting "Browser back button"? – sabithpocker Mar 07 '18 at 17:36
  • There is a sidenav and user chooses something else. At this point I want to reset the parameter in the URL. The URL parameter is used to preselect something on the sidenav and fill in some fields on a child component – flipZomb Mar 07 '18 at 17:42

1 Answers1

-1

Try injecting ActivatedRouteSnapshot and then accessing the parameter that way.

constructor(private route: ActivatedRouteSnapshot) {
    let myparam: string = route.params["aparameter"];
}
Woot
  • 1,759
  • 1
  • 16
  • 23
  • 1
    Thanks, but I don't understand what this would change. I am able to get the parameter. But I want to be able to "reset" it as soon as I have got it. Or am I missing something ... ? – flipZomb Mar 07 '18 at 16:23
  • The goal is to get the route parameter from the url and then change it to something else? Couldn't you just navigate to the new route? – Woot Mar 07 '18 at 19:02
  • yes, that is the goal. Navigating somewhere else would mean reloaoding a lot of data. But it is an option I am considering. – flipZomb Mar 08 '18 at 08:57
  • 1
    https://stackoverflow.com/questions/35618463/change-route-params-without-reloading-in-angular-2 why not build a route with createUrlTree and change it with location.go as suggested here? – Woot Mar 08 '18 at 19:15
  • Interesting, will give it a try. Thanks! ... wonder why I did not see this while searching ??? – flipZomb Mar 08 '18 at 19:33
  • location.replaceState("/xxxx") did what I was looking for. Thanks Woot for directing me to this solution. – flipZomb Mar 09 '18 at 13:42