Fetching Route Parameters in Angular 4

–HTML File

<p>User with ID {{user.id}} loaded.</p>
<p>User with is {{user.name}} loaded.</p>

–TS File

import { ActivatedRoute } from '@angular/router';

export class UserComponent implements OnInit {
  user: {id: number, name: string};

  constructor(private route: ActivatedRoute){}

  ngOnInit(){
    this.user = {
       id: this.route.snapshot.params['id'],
       name: this.route.snapshot.params['name']
    }
  }
}

–TS File (Routing)

{path: 'users/:id/:name', component: UserComponent}

Hit URL

http://localhost:4200/users/10/Google