Ошибка конфигурации маршрутизации Aurelia

Question

У меня возникла проблема с настройкой маршрута Aurelia, когда путь, как layer1/layer2 не только layer1. Вот структура файла проекта (файлы в дист будет создаваться автоматически на основе файлов в папке Src)

dist 
    | - home 
     | - home.html 
     | - home.js 
    | - user 
     | - register.html 
     | - register.js 
    app.html 
    app.js 
    main.js 
src 
    | - home 
     | - home.html 
     | - home.js 
    | - user 
     | - register.html 
     | - register.js 
    app.html 
    app.js 
    main.js 

Когда я следующий раз это работает отлично:

app.html

<template> 
 
    <div> 
 
    <a href="user">register user</a> 
 
    <a href="otherlink">otherlink</a> 
 
    </div> 
 
    <div class='main'> 
 
    <router-view></router-view> 
 
    </div> 
 
</template>

app.js

this.router.configure(config => { 
 
    config.title = 'demo'; 
 
    config.options.pushState = true; 
 
    config.map([ 
 
    // home routes 
 
    { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' }, 
 

 
    // User register 
 
    { route: ['user'], moduleId: './user/register', nav: true, title:'Register User'} 
 
    ]); 
 
});

Но когда я изменить путь от пользователя в пользователя/зарегистрировать, как показано ниже, он больше не работает

app.html

<template> 
 
    <div> 
 
    <a href="user/register">register user</a> 
 
    <a href="otherlink">otherlink</a> 
 
    </div> 
 
    <div class='main'> 
 
    <router-view></router-view> 
 
    </div> 
 
</template>

app.js

this.router.configure(config => { 
 
    config.title = 'demo'; 
 
    config.options.pushState = true; 
 
    config.map([ 
 
    // home routes 
 
    { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' }, 
 

 
    // User register 
 
    { route: ['user/register'], moduleId: './user/register', nav: true, title:'Register User'} 
 
    ]); 
 
});

И в хром отладчик, я вижу эту ошибку:

ПОЛУЧИТЬ http://localhost:9000/пользователь/расстояние/пользователь/register.html 404 (не найдено)

Обратите внимание, что каким-то дополнительным пользователь добавляется в URL-адрес, который не позволяет найти файл register.html. Опять же, когда я просто использую пользователь в качестве маршрута, он отлично работает без каких-либо ошибок, но когда я просто изменяю с пользователь на пользователь/зарегистрируйтесь, он больше не работает.

Может кто-нибудь, пожалуйста, сообщите мне, почему это происходит и как это исправить?

Answer 1

Измените href на ссылку href="#/user/register", и это должно устранить проблему.

Я не видел, что у вас включен pushState. Пожалуйста, измените index.html и добавьте

<base href="http://localhost:9000/"> 

или что-то ваш корневой URL является. Это должно решить проблему для вас.

Answer 2

Я сделал небольшое изменение в ответе Эшли, который делает немного более экологичным, поскольку нам не нужно жестко кодировать локальный url. Я тестировал его и хорошо работал.

<base href="/">