typescript read url parameters code example

Example 1: typescript read url parameters

// get all search params (including ?)
const queryString = window.location.search;
// it will look like this: ?product=shirt&color=blue&newuser&size=m

// parse the query string's paramters
const urlParams = new URLSearchParams(queryString);

// To get a parameter simply write something like the follwing
const paramValue = urlParams.get('yourParam');

Example 2: get url params in typescript

import {Router, ActivatedRoute, Params} from '@angular/router';
import {OnInit, Component} from '@angular/core';

@Component({...})
export class MyComponent implements OnInit {

  constructor(private activatedRoute: ActivatedRoute) {}

  ngOnInit() {
    // Note: Below 'queryParams' can be replaced with 'params' depending on your requirements
    this.activatedRoute.queryParams.subscribe(params => {
        const userId = params['userId'];
        console.log(userId);
      });
  }

}

Example 3: typescript read url search params

const product = urlParams.get('product')
console.log(product);
// shirt

const color = urlParams.get('color')
console.log(color);
// blue

const newUser = urlParams.get('newuser')
console.log(newUser);
// empty string