Module09 - Routing

Question 1

Module 9 - Routing
Import

Answer 1

import {Routes, RouterModule} from ‘@angular/router’;

//in .ts file
import { AddressService } from ‘./address.service’;

Question 2

Module 9 - Routing
Configure

Answer 2

//In .ts file
const approutes: Routes = [
{ path: “”, component: DavisComponent },
{ path: “davis”, component: DavisComponent },
{ path: “trafalgar”, component: TrafalgarComponent }
];

@NgModule({
imports: [
RouterModule.forRoot(approutes)
],
providers: [AddressService]
})

Question 3

Module 9 - Routing
Use

Answer 3

//In HTML file
<button (click)=”campusAddress(‘davis’)”>Get Address</button>

Question 4

What are the steps required to set up routing in an Angular application?

Answer 4

The steps include:
Importing Routes and RouterModule in app.module.ts.
Defining routes as an array of path-component pairs.
Registering routes using RouterModule.forRoot(approutes).

Question 5

How do you define a route in Angular, and what does the RouterModule.forRoot() method do?

Answer 5

A route is defined using the Routes array where each route includes a path and a component. The RouterModule.forRoot() method registers these routes with the Angular application.

Example:
const approutes: Routes = [
{ path: “”, component: DavisComponent },
{ path: “davis”, component: DavisComponent },
{ path: “trafalgar”, component: TrafalgarComponent }
];

@NgModule({
imports: [RouterModule.forRoot(approutes)],
})

Question 6

How do you link to a specific route using the routerLink directive in an Angular template?

Answer 6

Use the routerLink directive in an anchor tag or button element to navigate to a specific route.

Example:
<a routerLink="/davis">Davis Campus</a>