Problem while trying to do routing in Angular

Question

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [
{path: 'login', component: LoginComponent},
{path:'forget-password', component: ForgetPasswordComponent},
{path:'**', component: NotFoundComponent},
{path: '' , redirectTo : '/login', pathMatch: 'full'}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

*

This is my code but it says ,*

Compiled with problems:

ERROR

src/app/app-routing.module.ts:5:28 - error TS2304: Cannot find name 'LoginComponent'.

5 {path: 'login', component: LoginComponent}, ~~~~~~~~~~~~~~

ERROR

src/app/app-routing.module.ts:6:37 - error TS2304: Cannot find name 'ForgetPasswordComponent'.

6 {path:'forget-password', component: ForgetPasswordComponent}, ~~~~~~~~~~~~~~~~~~~~~~~

ERROR

src/app/app-routing.module.ts:7:24 - error TS2304: Cannot find name 'NotFoundComponent'.

7 {path:'**', component: NotFoundComponent}, ~~~~~~~~~~~~~~~~~

**

In my app.component.html , i have the following code also :

<router-outlet></router-outlet>

**

This is the first time i am trying angular routing and i was able to create routes for the components i created.

serenesky0914 · Answer 1 · 2023-03-19T13:45:16.927

You have to import all component which is used in AppRoutingModule.

If they aren't, you can create all component using terminal in auth folder

ng g auth/[component_name],

And here is the code for AppRoutingModule.

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { LoginComponent } from './auth/login.component';
import { ForgetPasswordComponent} from './auth/forget-password.component';
import { NotFoundComponent} from './auth/not-found.component';

const routes: Routes = [
{path: 'login', component: LoginComponent},
{path:'forget-password', component: ForgetPasswordComponent},
{path:'**', component: NotFoundComponent},
{path: '' , redirectTo : '/login', pathMatch: 'full'}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Problem while trying to do routing in Angular

*

This is my code but it says ,*

In my app.component.html , i have the following code also :

1 Answers1