Route Order in Angular

Angular processes routes from top to bottom. This means that special cases of routes should be placed first, and then more general ones.

In the following example, the first route will always work:

const appRoutes: Routes =[
	{ path: '**', component: NotFoundComponent },
	{ path: 'aaaa', component: AaaaComponent},
	{ path: 'bbbb', component: BbbbComponent},
];

Change the order of the routes in the example to the correct one:

const appRoutes: Routes =[
	{ path: 'blog/:id', component: AaaaComponent},
	{ path: 'blog/new', component: BbbbComponent},
];