Search code examples
angularurl-routingangular2-routingplunkerangular2-router3

Error: Cannot match any routes. URL Segment: ''


I'm trying to reproduce my problem with Angular2 router but i cannot create a working copy of my project in Plunker.

Here is my try: https://plnkr.co/edit/1lpoYP4qlBZLuqZHW7Ft

I used the following line of code in the index.html file to make the routes paths working with the run environment of Plunker and with my '' default paths.

<script>document.write('<base href="' + document.location + '" />');</script>

Why i'm stilling get this error?


Solution

    1. You have a small typo in your plnkr:

      loadChildren: 'app/fist-section.module#FirstSectionModule' }

      might be first ;)

    2. There's still another problem: Even childrens need an empty ''-path. So instead of writing

    children: [ { path: 'first-section', loadChildren: 'app/first-section.module#FirstSectionModule' } ] you should add an empty path and redirect to the first-section-path like this:

    children: [
        { path: '', redirectTo: 'first-section'},
        { path: 'first-section', loadChildren: 'app/fist-section.module#FirstSectionModule' }
    ]
    

    Here is the corrected plnkr:

    https://plnkr.co/edit/9fMwx0?p=preview


    Update Angular 2.4.1:

    I noticed that with the latest version of angular (2.4.1) it is not necessary any more to use an empty path for the children routes.

    I updated the plunker with the latest angular 2.4.1 version: PLUNKER. The sample is running without an empty path right now.