Skip to content

Get Query String from Route URI

Tyler Ruff edited this page Jun 14, 2022 · 1 revision

Getting a query string from a route URI element is simple (ex: example.com/home?id=7)

  1. Import ActivatedRoute (in component.ts):
import { ActivatedRoute } from '@angular/router';
  1. Add to component class:
...
id: string | undefined;
constructor(private route: ActivatedRoute) { }

ngOnInit() {
this.route.queryParams
 .subscribe(params => {
	this.id = params['id'];
 }
);
...
  1. The query string will now be available to the component as the "id" variable:
<ng-container *ngIf="id">
 ...
  <app-item [itemId]="id"></app-item>
  <span>
    {{ id }}
  </span>
 ...
</ng-container>
Clone this wiki locally