Angular 5 router link is NaN
Angular 5 router link is NaN
I have this router file in angular 5:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login.component';
import { ForgotPasswordComponent } from './forgot-password/forgot-password.component';
const routes: Routes = [
{
path:'login',
component: LoginComponent,
},
{
path:'forgotpassword',
component: ForgotPasswordComponent,
},
{
path: '',
component: LoginComponent,
pathMatch: 'full'
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
providers:
})
export class LoginRoutingModule { }
And here is my components html:
When I clikc on forgot password, I see an error: EXCEPTION: Uncaught (in promise): Error: Cannot match any routes. URL But when I enter the url normally it works: http://localhost:4200/login/forgotPassword or http://localhost:4200/forgotPassword This should not happen as well, as I want the first url to be valid and to go to forgot password component from login component only. Try below code: in module: and in HTML: OR Wrap your route into or just without
</div>
<form [formGroup]="loginForm">
Login
</div>
</form>
</div>
</div>
</div>
</div>
Segment: 'NaN' Error: Cannot match any routes. URL Segment: 'NaN'
2 Answers
2
{
path: 'login', component: LoginComponent,
children: [
{ path: 'forgotPassword', component: ForgotPasswordComponent },
]
}[routerLink]='/login/forgotPassword'routerLink='/login/forgotPassword''' to make it a string.''[routerLink]="'login/forgotPassword'"
^ ^routerLink="login/forgotPassword"
Nope. It didn't worked.
– droidnation
Jul 3 at 9:01
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
according to your routes, you dont have login/forgotpassword.. U should change it to forgotpassword, or make a child route in login route
– dAxx_
Jul 3 at 9:04