Categories

Jan 6 in Angular

Q: Demonstrate navigating between different routes in an Angular application.

1 Answer

Jan 6
Following code demonstrates how to navigate between different routes in an Angular app dubbed “Some Search App”:

import {Router} from "@angular/router";

.

.

.

@Component({

  selector: 'app-header',

  template: `

<nav class="navbar navbar-light bg-faded">

  <a class="navbar-brand" (click)="goHome()">Some Search App</a>

  <ul class="nav navbar-nav">

    <li class="nav-item">

      <a class="nav-link" (click)="goHome()">Home</a>

    </li>

    <li class="nav-item">

      <a class="nav-link" (click)="goSearch()">Search</a>

    </li>

  </ul>

</nav>

 `

})

class HeaderComponent {

  constructor(private router: Router) {}

  goHome() {

    this.router.navigate(['']);

  }

  goSearch() {

    this.router.navigate(['search']);

  }

}
Click here to read more about Angular JS
Click here to read more about Insurance

Related questions

Madanswer
Feb 15 in Angular
Sep 13, 2019 in Angular
Jan 15 in Angular
...