-1

I want to redirect at Home page if user type any URL which is not exist in system

Ketan Navadiya
  • 279
  • 3
  • 6
  • 18

2 Answers2

2

In app.module.ts, add the following line to the imports list, after the other modules. If it's added before other routes, it will redirect to home for those routes.

RouterModule.forChild([{ path: '**',   redirectTo: '/' }])

You'll also need to import RouterModule:

import { RouterModule } from '@angular/router';
Jon Ruddell
  • 6,244
  • 1
  • 22
  • 40
  • Thanks @Jon for your answer I have added object that you have given me like beloved code but It always (in all right & wrong) Redirects to home, ` const LAYOUT_ROUTES = [ navbarRoute, ...errorRoute, { path: '**', redirectTo: '/' } ]; ` ** it redirect to home for all routers (exist & non-exists both)** – Ketan Navadiya Oct 07 '18 at 18:51
  • You're right. The wildcard route has to go after the other routes or it won't work. I updated the answer with a possible solution. – Jon Ruddell Oct 07 '18 at 21:07
  • Thanks @Jon Ruddell, now it is working fine for me. but it is not working when I enter wrong SubRoutes. for Ex:- localhost:8080/customer/XYZ. here customer is one route but XYZ is not any sub route. Thanks you so much for correct answer and please give me solution for any another problem too. – Ketan Navadiya Oct 08 '18 at 07:53
  • Is the wildcard route located after your entity module import in app.module.ts? I can't reproduce what you mentioned (note you are missing the `#` in the url) – Jon Ruddell Oct 08 '18 at 18:52
  • If you are talking about the grey error page that says not found, you can add `` to the header in src/main/resources/templates/error.html – Jon Ruddell Oct 08 '18 at 18:55
0

You can use ** rule at the end of your navbar.routes to redirect to Home page. Below is the example:

{ path: '**', component: HomeComponent}
Jignesh M. Khatri
  • 1,407
  • 1
  • 14
  • 22
  • I have updated navbar.route.ts file as follow but still it is not working `import { Route, Routes } from '@angular/router'; import { NavbarComponent } from './navbar.component'; import { HomeComponent } from '../../home'; export const navbarRoute: Routes = [{ path: '', component: NavbarComponent, outlet: 'navbar' }, { path: '/**', component: HomeComponent} ]; ` it throws me me following error **ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'sdfsfsdf' Error: Cannot match any routes. URL Segment: 'sdfsfsdf'** – Ketan Navadiya Oct 07 '18 at 15:26
  • try removing `/` before `**` – Jignesh M. Khatri Oct 07 '18 at 17:07
  • I have also tried after removing this but I am still getting same issue and i am using Jhipster and this Application is generated by Jhipster. – Ketan Navadiya Oct 07 '18 at 17:28