Как я могу сгенерировать правильный URL-адрес детали с помощью маршрутизатора Aurelia?

Question

Одна из моделей моего приложения находится под маршрутами:

http://localhost:9000/#/historical-orders/
http://localhost:9000/#/historical-orders/page/2/
http://localhost:9000/#/historical-orders/page/3/

и так далее. Это list view-modelпоэтому, когда пользователь нажимает на одну из его строк, он или она должны быть направлены на:

http://localhost:9000/#/historical-orders/details/:orderId

Кажется достаточно простым, верно? Однако есть проблема с генерацией маршрута. А именно: если я просматриваю одну из страниц (URL, заканчивающиеся на page/:pageNumber/потом звоню router.generate дает мне детали URL, который выглядит так: #/historical-orders/page/1/details/:orderId что явно неверно. Мой конфиг маршрута:

export class App {
    configureRouter(config, route) {
        config.map([
            {
                route: ["historical-orders", "historical-orders/page/:pageNumber"],
                moduleId: "orders/historical-orders-section",
                name: "historical-orders-section",
                title: "Historical orders",
                nav: true
            }
        ]);
    }
}

Раздел исторических приказов:

export class HistoricalOrders {
    configureRouter(config, router) {
        config.map([
            { 
                route: "", 
                moduleId: "orders/historical/orders-list", 
                title: "Orders history", 
                nav: false
            }, 
            {
                route: "details/:id",
                moduleId: "orders/historical/order-details",
                name: "historical-orders-details",
                title: "Details",
                nav: false
            },
        ]);
    }
}

И генерация маршрута детального вида выглядит вполне обычно:

this._router.generate("historical-orders-details", { id: order.pk });

Итак, как заставить маршрутизатор генерировать правильные URL-адреса?

Answer 1

Сгенерированный URL не является неправильным. Вы используете дочерний маршрутизатор, поэтому сгенерированный URL #/historical-orders/page/1/details/:orderId,

Чтобы получить URL, например, #/historical-orders/details/:orderId, вы должны сделать это:

export class App {
    configureRouter(config, route) {
        config.map([
            {
                route: ["historical-orders", "historical-orders/page/:pageNumber"],
                moduleId: "orders/historical-orders-section",
                name: "historical-orders-section",
                title: "Historical orders",
                nav: true
            },
            {
                route: "orders/historical-orders/details/:id",
                moduleId: "orders/historical/order-details",
                name: "historical-orders-details",
                title: "Details",
                nav: false
            }
        ]);
    }
}

затем

let url = this._router.generate("historical-orders-details", { id: order.pk });

РЕДАКТИРОВАТЬ Для доступа к текущему маршрутизатору

import {inject} from 'aurelia-dependency-injection';
import {Router} from 'aurelia-router';

@inject(Router)
export class HistoricalOrders {

    constructor(router) {
       this.router = router; //this is the same app.js router
    }
}