【问题标题】:Route Not found error in Durandal child routeDurandal 子路线中的路线未找到错误
【发布时间】:2014-03-20 07:16:47
【问题描述】:

当我尝试使用子路由时,我得到“找不到路由”。为了涵盖我的基础,这里是应用程序中路由的设计方式。

main.js 文件包含顶部导航的路由,并按如下方式完成-

                    router.map([
                        { route: 'LOC', moduleId: 'LOC', title: 'LC', nav: 3 }
                    ]);

我将页面页脚的路线映射为-

        router.map('About', 'About', 'About', false);
    router.map('Help', 'Help', 'Help', false);

当用户点击上面创建的“LOC”路线时,左侧导航会显示在该视图上。该视图使用子路由并设置为-

var childRouter = router.createChildRouter()
    .makeRelative({
        moduleId: 'viewmodels/',
        fromParent: true
    }).map([
                        { route: '*LCClientSearch', moduleId: 'LCClientSearch', title: 'Create LC', type: 'intro', hash: '#LCClientSearch', nav: true },
                        { route: '*LCPending', moduleId: 'LCPending', title: 'Pending LC', type: 'intro', hash: '#LCPending', nav: true }

    ]).buildNavigationModel();

LOC 默认为 LCClientSearch 路由并在最初正确显示它,但是,从那时起没有任何事情发生。当用户单击 LCClientSearh 或 LCPending 时,我收到“找不到路由”错误。

LOC 视图-

     <div class="span2 well">
    <ul class="nav nav-list">
        <li class="nav-header">Availability</li>

        <!--ko foreach: availability-->
        <li data-bind="css: { active: isActive }">
            <a data-bind="attr: { href: hash }, text: title"></a>
        </li>
        <!--/ko-->

        <li class="nav-header">Manual Post</li>


        <!--ko foreach: ManualPost-->
        <li data-bind="css: { active: isActive }">
            <a data-bind="attr: { href: hash }, text: title"></a>
        </li>
        <!--/ko-->
    </ul>
</div>

为什么找不到路线?

【问题讨论】:

  • 我认为您的子路由器中的 moduleId 应该是“LOC”而不是视图模型。
  • @nimgrg 我更改了moduleid,但仍然无法正常工作。当页面第一次加载时,它实际上加载了 LCClientSearch 视图。所以,在页面加载的时候是在寻找子路由,只是点击子路由链接时导航不起作用。

标签: knockout.js requirejs durandal single-page-application durandal-2.0


【解决方案1】:

我怀疑这是因为您的父路线没有 splat - check out the documentation for child routers。尝试将路由从父视图更改为:

router.map([
    { route: 'LOC*details', moduleId: 'LOC', title: 'LC', nav: 3 }
]);

然后将子路由改为:

[
    { route: 'LCClientSearch', moduleId: 'LCClientSearch', title: 'Create LC', type: 'intro', nav: true },
    { route: 'LCPending', moduleId: 'LCPending', title: 'Pending LC', type: 'intro', nav: true }
]

那应该分别匹配路由LOC/LCClientSearchLOC/LCPending

【讨论】:

  • 谢谢!你猜对了。我必须添加的唯一其他添加是父级中的哈希(哈希:'#LOC')。
  • 太棒了,很高兴我能帮上忙 :-)
  • 嗨@gerrod,首先感谢您的回答。我已经成功实现了这一点,它就像一个魅力!但不幸的是,当我尝试导航到父路由(例如:LOC)时,它会在控制台中向我显示一条消息,例如:“Route Not Found LOC”。任何帮助或建议将不胜感激。谢谢 ! :)
猜你喜欢
  • 2019-11-28
  • 1970-01-01
  • 1970-01-01
  • 2014-06-06
  • 1970-01-01
  • 2011-06-14
  • 2021-11-04
  • 2019-01-16
  • 1970-01-01
相关资源
最近更新 更多