如何在角度ui路由器中使最后一個斜杠為可選？

Question

我有兩種狀態：

    $stateProvider.state('app', {
        url: '/app',
        template: '<app-index></app-index>',
        data: {},
        resolve: {}
    });
    $stateProvider.state('app.list', {
        url: '/list/:type?',
        template: '<app-list></app-list>',
        data: {},
        resolve: {}
    })

它工作正常，但是當我鍵入url / app / list時，它將重定向到主頁，我如何使斜杠為可選？ 我嘗試將這個網址設為'/ list / ?: type？' 但這沒用。 我應該添加重定向，如果是，那么如何？

Answer 1

我不相信有屬性可以做到這一點，但是您可以通過設置帶有斜線的子路由來使其工作

.state('app', {
    url: '/app',
    template: '<app-index></app-index>',
})
.state('app.withSlash', {
    url: '/',
})

要在“ app”之上添加其他路由，您可以忽略“ .withSlash”的存在

.state('app.withOtherParam', {
    url: '/:id',
})

這是路線的示例，其中斜杠是可選的，並且在其后有一個附加參數。

.state('app', {
    url: '/app',
    abstract: true,
    template: '<ui-view/>',
})
.state('app.specificPage', {
    url: '/',
    template: '<someTemplate>'
})
.state('app.withId', {
    url: '/:id',
    template: '<someTemplate>',
})
.state('app.withId.withSlash', {
    url: '/',
})