Malik Shahzad
Malik Shahzad

Reputation: 6959

Angular 2 - All routes move to '**' in custom 404 Page

When user enters the dirty URL ( like www.example.com/url-not-exist ), I want the users to redirect to 404 component. But right now all urls are catching into 404.

Code:

app.routes.ts
-------------
const routes: Routes = [
    { path: '404', component: NotFoundComponent},
    { path: '**', redirectTo: '404' },
];


app.module.ts
-------------
imports: [
    CommonModule,

    AppRoutes,
    Module1,
    Module2
],

Project Structure:

app.module.ts // module1 and module 2 imported in this file
app.routes.ts // module1 and module 2 imported in this file

module1/
  ----- module1.module.ts
  ----- module1.routes.ts // routes imported in above file

module2/
  ---- module2.module.ts
  ---- module2.routes.ts // routes imported in above file

Upvotes: 1

Views: 257

Answers (1)

krueger
krueger

Reputation: 271

Make sure that your web server re-directs all requests to your Angular application index.html. Otherwise your application will never have the chance to react and route to your 404-component.

Upvotes: 1

Related Questions