Question

我无法理解为什么，在我的Durandal应用程序中，在我转到详细信息页面然后返回列表后，我会获得一个网址，其中包含当前网址中嵌入的详细信息页面的网址。

例如：

当我开始时，我得到了：http://localhost:51429/#/

然后我转到详细信息页面：http://localhost:51429/physDetail

然后我回到列表页面：http://localhost:51429/physDetail#/physList

为什么我得到＆＃39; physDetail＃＆＃39;嵌入网址？问题是，如果我按F5刷新html，我会得到404。

我设置这样的路线：

  var routes = [{
    url: 'physList',
    moduleId: 'viewmodels/physList',
    name: 'Physicians',
    visible: true
  }, {
    url: 'physDetail',
    moduleId: 'viewmodels/physDetail',
    name: 'View Physician Detail',
    visible: false
  }, {
    url: 'incentives',
    moduleId: 'viewmodels/incentiveList',
    name: 'Incentives',
    visible: true
  }, {
    url: 'membershipList',
    moduleId: 'viewmodels/membershipList',
    name: 'Membership',
    visible: true
  }];

单击列表中的行，切换到详细信息页面。 HTML列表如下所示：

 <tbody data-bind="foreach: $root.physicians, delegatedHandler: 'click'">
    <tr data-click="physClicked">
    <td data-bind="text: contact_LastName"></td>
    <td data-bind="text: contact_FirstName"></td>
    <td data-bind="foreach: contact_Phones">
        <span data-bind="phoneFormat: fullPhone"></span>
    </td>
    <td data-bind="foreach: contact_Emails">
        <span data-bind="emailFormat: address"></span>
    </td>
    </tr>
 </tbody>

js处理程序如下所示：

function physClicked(phys, event) {
  router.navigateTo("physDetail");
  return;
}

单击页面顶部的按钮返回列表（或其他页面）。按钮HTML如下所示：

<div class="btn-group" data-bind="foreach: router.visibleRoutes">
  <a data-bind="css: { active: isActive }, attr: { href: hash }, text: name" 
     class="btn btn-info" href="#"></a>
</div>

我应该禁止跳转到另一个页面吗？我应该只在保存或取消后允许后退按钮或执行router.navigateBack（）吗？

我已经尝试在Durandaljs网站上找到一些指导，但要么它不存在，要么我不知道要问的正确问题。

感谢您的任何见解。

Answer 1

您应该考虑将url参数转换为路线。这可能是弄乱你的url哈希创建的东西。此外，设置默认路线也是个好主意。这将是一个评估为空哈希或根本没有哈希的那个。在Durandal 2.x中，路由对象可以接受数组而不仅仅是字符串。您可以将数组中的第一项设置为空字符串，以表示如果没有找到哈希，这是您网址的默认路由。

var routes = [{
  route: ['', physList'],
  moduleId: 'viewmodels/physList',
  name: 'Physicians',
  visible: true
}, {
  route: 'physDetail',
  moduleId: 'viewmodels/physDetail',
  name: 'View Physician Detail',
  visible: false
}, {
  route: 'incentives',
  moduleId: 'viewmodels/incentiveList',
  name: 'Incentives',
  visible: true
}, {
  route: 'membershipList',
  moduleId: 'viewmodels/membershipList',
  name: 'Membership',
  visible: true
}];

Answer 2

我仍然无法理解为什么“#physDetail”插入URL但决定只允许使用router.navigateBack（）的'goBack'选项返回到原始的医生列表。这避免了问题，并可能使ux更加均匀。

我这样做是通过给<div class="btn-group"...>一个id并在physDetail.js的激活中做一个jQuery'hide'。这将阻止导航到不同的列表。

当执行navigateBack（）时，URL是干净的，并且没有'#physDetail'。

在转到某个页面然后返回时，Url不会返回基本状态

2 个答案: