2

I'm trying to implement routing in my Angular 2 application. My objective is to be able to use the browser address bar to display a specific object by the id.

Here are my routes:

export const appRoutes: Routes = [
    {
        path: 'intervention/:id',
        component: InterventionMainDisplay
    },
    {
        path: 'intervention',
        component: InterventionMainDisplay
    }
];

I don't understand why when i enter in the browser address bar: http://localhost:3000/intervention or http://localhost:3000/intervention/15893 .. none of my routes are matched.

In the index.html I have <head><base href="/" />

I checked the router module configuration is loaded:

@NgModule({
    imports:      [
        RouterModule.forRoot (appRoutes) ], ...

Here is the full error:

Uncaught (in promise): Error: Cannot match any routes. URL Segment: ''
Error: Cannot match any routes. URL Segment: ''
    at new Error (native)
    at ApplyRedirects.noMatchError
Anthony Brenelière
  • 60,646
  • 14
  • 46
  • 58
  • 1
    Try enabling `HashLocationStrategy` http://stackoverflow.com/questions/36861628/location-and-hashlocationstrategy-stopped-working-in-beta-16/36861629#36861629 – Günter Zöchbauer Dec 22 '16 at 11:17
  • 1
    Yes it does work when enabling HashLocationStrategy !! Now the url to type is http://localhost:3000/#/intervention/1239817 ( the # is added in the url). So now I ask: why it does'n work with the PathLocationStrategy, the default strategy ? – Anthony Brenelière Dec 22 '16 at 14:48
  • 1
    The server needs to support HTML5 pushState for `PathLocationStrategy` to work (some simple rewrites) – Günter Zöchbauer Dec 22 '16 at 14:57
  • ok, and I'm using nom liteserver that does not support html5 pushState. The application is aimed to work on IIS 8.5. – Anthony Brenelière Dec 22 '16 at 15:14
  • I don't use these servers. There are lot of such questions here on SO with answers with HTML5 pushState configurations for all kinds of servers. – Günter Zöchbauer Dec 22 '16 at 15:19

0 Answers0