I am not able to extract Query params from Url in Angular 6

Question

i am passing Id as parameter i mu routing path, but while i am extracting prams i am getting error.

i tried to abstract parameter using route.params.subscribe() method.

method where i am passing Id with key name as term

onEdit(id:string) {
    console.log(id);   
    this.router.navigate(['../UpdateOrganization',{ term: id }], { relativeTo: this.route }); 
  }

My url looks like this :-

http://localhost:4200/#/dashboard/UpdateOrganization;term=MSI3563

Method where i am extracting query parameter from url

ngOnInit() {
    this.createFormControls();
    this.createForm();
    this.route.params.subscribe(params => {
      if (params['term']) {
        this.selectedId = params['term'];
      }
    });
    console.log(this.selectedId);
  }

I am getting following error message in my console

ERROR TypeError: Cannot read property 'params' of undefined

Answer 1

query params usually have a ? before them in url so http://localhost:4200/#/dashboard/UpdateOrganization;term=MSI3563 should actually be http://localhost:4200/#/dashboard/UpdateOrganization?term=MSI3563

I think you are missing queryParams object from there this.router.navigate(['../UpdateOrganization', { queryParams: { term: id }}], { relativeTo: this.route });

To read query params you have to do subscribe to queryParams and not params

  this.route.queryParams.subscribe(params => {
        this.param1 = params['term'];
    });

In constructor set route to Activated route

constructor(private route: ActivatedRoute){}