Angular 2+ Routing redirect

Question

This may seems as a silly question but I can't understand this routing

routes.ts:

const APP_ROUTES: Routes = [
  { path: 'home', component: HomeComponent },
  { path: 'articles', component: ArticulosComponent },
  { path: 'article/:id', component: ArticuloComponent },
  { path: '', pathMatch: 'full', redirectTo: 'home' },
  { path: '**', pathMatch: 'full', redirectTo: 'notfound' }
];

When access to localhost:4200/article/6 the router redirects to localhost:4200/#/home but when manually wrote localhost:4200/#/article/6 works fine.

First, note # symbol, why is it there and what different does it cause? And... I specify 'manually' because even through code adding the # symbol to the path (ex. <a href="#/article/6"></a>) keeps redirecting to home

The main question/problem is "Which would be the correct link or rule in other to load the correct component?"

Answer 1

You can remove # from route changing value of useHash in app.module.ts

RouterModule.forRoot(ROUTES, { useHash: false }),

You can add pathMatch: 'full' with home and articles routes