angular router 404 page code example

Example: 404 page setup in angular routing

/* 404 Page not found page setup in Angular Routing */

$ ng generate component notfound

Next, open the src/app/app-routing.module.ts file and add these two routes:

const routes: Routes = [
  // [...]
  {path: '404', component: NotFoundComponent},
  {path: '**', redirectTo: '/404'}

];

Don't forget to import the component in the routing module as follows:

import { NotFoundComponent } from './notfound/notfound.component';

We use the wildcard path denoted by ** to catch any non existing routes and we use the redirectTo property to redirect them to the /404 path which maps to the not found component.