0 votes
in Angular by
Can you demonstrate navigation between different routes in an Angular application?

1 Answer

0 votes
by

You can demonstrate the navigation between different routes in an Angular app in the following way. See the following code to demonstrate navigation in an Angular app named "My First App."

  1. import from "@angular/router";  
  2. .  
  3. .  
  4. .  
  5. @Component({  
  6.   selector: 'app-header',  
  7.   template: `  
  8. <nav class="navbar navbar-light bg-faded">  
  9.   <a class="navbar-brand" (click)="goHome()">My First App</a>   
  10.   <ul class="nav navbar-nav">  
  11.     <li class="nav-item">  
  12.       <a class="nav-link" (click)="goHome()">Home</a>   
  13.     </li>  
  14.     <li class="nav-item">  
  15.       <a class="nav-link" (click)="goSearch()">Search</a>   
  16.     </li>  
  17.   </ul>  
  18. </nav>  
  19. })  
  20. class HeaderComponent {  
  21.   constructor(private router: Router) {}   
  22.   goHome() {  
  23.     this.router.navigate(['']);   
  24.   }  
  25.   goSearch() {  
  26.     this.router.navigate(['search']);   
  27.   }  
  28. }  

Related questions

0 votes
asked Nov 24, 2019 in Angular by rajeshsharma
0 votes
asked Jun 5, 2022 in Angular by Robindeniel
...