Durandal 导航：attr href 绑定不起作用

Question

我在 Durandal 中有以下导航设置：

layout.js

...
that.activate = function () {
    router.map([
        { route: '', title: abp.localization.localize('HomePage', 'MyProject'), moduleId: 'viewmodels/home', nav: true, menuName: 'Home' },
        { route: 'editpage/:id', title: abp.localization.localize('EditPage', 'MyProject'), moduleId: 'viewmodels/editpage', hash: '#/editpage/id' }
    ]).buildNavigationModel();

pages.js

...
that.editPage = function (page) {
    that.router.navigate('editpage/' + page.id());
};

pages.cshtml

<ul class="list-group" data-bind="foreach: pages">
    <div class="list-group-item">
        <span class="page-name" data-bind="text: name"></span>
        <div class="text-right">
            <!--<button type="button" class="btn btn-info btn-sm" data-bind="click: $parent.editPage">-->
            <button type="button" class="btn btn-info btn-sm" data-bind="attr: {href: '#/editpage/' + id()}">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> @L("EditPage")
            </button>
        </div>
    </div>
</ul>

当我点击编辑页面按钮时，我想导航到“EditPage/:id”页面。但是只有点击绑定有效：

<button type="button" class="btn btn-info btn-sm" data-bind="click: $parent.editPage">

attr href 绑定没有：

<button type="button" class="btn btn-info btn-sm" data-bind="attr: {href: '#/editpage/' + id()}">

我尝试了几种配置方式，但似乎都没有帮助。我猜这只是路由配置或哈希中的不正确语法。想不通。

任何帮助将不胜感激！

Answer 1

试试这个

<a class="btn btn-info btn-sm" data-bind="attr: { href: '#editpage/' + id() }"></a>

1) 使用href attr 和a 标签代替button
2) 在# 之后删除了不必要的/

   #/editpage/ changed to #editpage/

Answer 2

我之前没有使用过 hash 参数。但是，根据路由器文档 (http://durandaljs.com/documentation/Using-The-Router.html)，您在此处查找的哈希实际上是 #/editpage/id，而您传递的哈希是 '#/editpage/' + id()。请尝试编写以下代码：

路由器：

{ route: 'editpage/:id', title: abp.localization.localize('EditPage', 'MyProject'), moduleId: 'viewmodels/editpage', hash: '#editpage/:id' }

页面

<button type="button" class="btn btn-info btn-sm" data-bind="attr: {href: '#editpage/' + id()}">

此外，如果您只是超链接到路由（就像您所做的那样）并从路由中删除哈希参数，您应该没问题。