how to navigate from one page to another in angular
import { Router } from '@angular/router';
export class YourComponentClassName implements OnInit {
constructor(private router: Router) {}
gotoHome(){
this.router.navigate(['/home']); // define your component where you want to go
}
}add a route to a buttoin in angular
<button type="button" class="btn btn-primary-outline pull-right" (click)="btnClick();"><i class="fa fa-plus"></i> Add</button>
// myComponent.component.ts file
import { Router } from '@angular/router';
constructor(private router: Router) {
}
// myComponent.component.thml
btnClick= function () {
this.router.navigateByUrl('/user');
};redirect angular
import { RoleComponent } from './role/role.component';
import { AppComponent } from './app.component';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', redirectTo: '/AppComponent', pathMatch: 'full' },
{ path: 'role', component: RoleComponent },
];
@NgModule({
imports: [ RouterModule.forRoot(routes) ],
exports: [ RouterModule ]
})
export class AppRoutingModule {
constructor(private router: Router)
}
functionOnWhichRedirectShouldHappen(){
router.navigate(['/role']);
}button routing
<a routerLink="/">Go To Home</a>how to navigate from one page to another in angular
<button class="btn btn-primary" (click)="gotoHome()">Home</button>how to navigate from one page to another in angular
const routes: Routes = [
{ path:'', component:LoginComponent},
{ path: 'home', component:HomeComponent }, // you must add your component here
{ path: '**', component:PageNotFoundComponent }
];Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
