How to Create and Next Button in Angular

by

I’m new to Angular and I’m trying to create a Next button to route to the next page, but I only want it to go to the page if I answer a question as yes It can go to the next page but skip a part if the answer is no. If any of this make sense. I can further explain.

const routes: Routes = [
{path:'', redirectTo:'home',pathMatch: "full"},
{path:'home', component: HomeComponent},
{path:'veteran', component: VeteranComponent},
{path:'veteran-snap', component: VeteranSnapComponent},
{path:'almost', component: AlmostComponent},
{path:'signature', component: SignatureComponent}
];

These are my routes.

in the template

<input type="checkbox" #question name="quesiton1">
<button (click)="navigateIfYes(question.checked)">Go Next</button>

in the component

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

constructor(private router: Router) {}

navigateIfYes(value: string) {
    this.router.navigateByUrl(!!value ? VALUE_CHECKED_PAGE : VALUE_UNCHECKED_PAGE).catch(console.error);
}

This is a very basic example but the question is too generic to give an in depth answer

Leave a Comment