Question

可以在窗口小部件中创建childRouter，可以通过使用窗口小部件再次在其他页面中重复使用吗？

这就是我的目录树的样子：

* app
  * views
     * dashboard (route: /dashboard)
        - dashboard.html
        - dashboard.js
     * shells
     * projects (route: /projects)
  * widgets
     * timeline
        - view.html
        - viewmodel.js
        * child
            - all.html
            - all.js
            - task.html
            - task.js

我想做的是：

在时间轴小部件中，我想要多个标签。
```
e.g: [ ALL ] and [ TASK ]
```
然后，我可以在 / dashboard 和 / projects 页面上使用该小部件。

例如，如果我当前在 / dashboard 页面中使用该小部件，那么当我点击小部件内的任何标签按钮时（对于这种情况，让我说我点击任务标签按钮 ）它将从＆＃39; localhost / dashboard ＆＃39;更改当前网址到＆＃39; localhost / dashboard / tasks ＆＃39; （不刷新页面）。然后它将在窗口小部件中显示来自 / widgets / timeline / child / tasks 的视图。

因此，如果我在 / projects page 中使用该窗口小部件，它将会反过来，它将从＆＃39; localhost / projects更改当前URL ＆＃39;到＆＃39; localhost / projects / tasks ＆＃39;

这是我迄今为止所尝试过的：

在 timeline.js 小部件内：

var parentModuleId = router.activeItem()['__moduleId__'];

var childRouter = router.createChildRouter().makeRelative({
        fromParent: true,
        moduleId: parentModuleId
    }).map([
        { route: ['all', ''], moduleId: 'widgets/timeline/child/all', title: 'Show All', nav: true },
        { route: 'tasks', moduleId: 'widgets/timeline/child/tasks', title: 'Tasks', nav: true },
    ]).buildNavigationModel();

在 timeline.html 小部件内：

<section>
    <div class="panel panel-default">
        <div class="panel-heading" data-bind="foreach: router.navigationModel">
            <a data-bind="attr: { href: hash, title: title }" class="btn btn-primary btn-lg">
                 <span data-bind="text: title"></span>
            </a>
        </div>
    </div>

    <div data-bind="router: { router: router }"></div>
</section>

在 dashboard.html 或 projects.html 内：

<div>
    <div data-bind="widget: { kind: 'timeline' }"></div>
</div>

但它似乎不起作用..

任何帮助，想法和建议都将非常感谢！

谢谢

DurandalJS：在widget中创建childRouter？

0 个答案: