Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Passing query parameter by using navigateByUrl()

I am trying to Navigate to a new page on click of an icon and below is the code

  this.prj = e.data.project_number;
  this.router.navigateByUrl('/dashboard/ProjectShipment/634');

Instead of this hardcoded query parameter 000634 I have to pass a this.prj in to it. My path is like below

const appRoutes: Routes = [
  {
  path: 'dB',
  data: { title: 'Dashboard' },
  children: [
      {
          path: 'ProjectShipment/:reportProject',
          component: ProjectShipmentComponent,
          data: { title: 'Project Shipment' },
      }
like image 642
trx Avatar asked Aug 28 '19 12:08

trx


People also ask

How do I use navigateByUrl?

navigate creates a new URL by applying an array of passed-in commands, a patch, to the current URL. To see the difference clearly, imagine that the current URL is '/inbox/11/messages/22(popup:compose)' . With this URL, calling router. navigateByUrl('/inbox/33/messages/44') will result in '/inbox/33/messages/44' .

How do I get query parameters in Angular 13?

Use queryParamMap to access query parameters. Another way to access query paramters in Angular is to use queryParamMap property of ActivatedRoute class, which returns an observable with a paramMap object.

How do you query parameters in a URL?

Query parameters are a defined set of parameters attached to the end of a url. They are extensions of the URL that are used to help define specific content or actions based on the data being passed. To append query params to the end of a URL, a '? ' Is added followed immediately by a query parameter.


1 Answers

You can use 'router.navigate' instead 'router.navigateByUrl':

this.router.navigate([URL],{ queryParams: { id: this.prj });
like image 101
Miguel Pinto Avatar answered Oct 08 '22 05:10

Miguel Pinto