Developer Snippet Diary

Passing Parameters to Route | Angular Routing | Angular 15+

1.open file app/app-routing.module.ts

const routes: Routes = [
  {path:'',redirectTo:'home',pathMatch:'full'},
  {path:'home',component:HomeComponent},
  {path:'home/:name',component:HomeComponent},
];

2.open file home.component.ts

export class HomeComponent {
  name:any = '';
  constructor(private activated_route:ActivatedRoute){ //get current activated route
  }
  ngOnInit(){
    this.name = this.activated_route.snapshot.paramMap.get('name');
  }
}

3.open home.component.html

<div>
    This is new user {{name}}
</div>

4. visit the url 

http://localhost:4200/home/john

Posted by: R GONDAL
Email: rizikmw@gmail.com