6

在我的 shell 中，我已经像这样设置了我的路线：

router.map([
            { route: '', title: 'Search', moduleId: 'viewmodels/search/search' },
            { route: 'location/:paramX/:paramY', title: 'Location', moduleId: 'viewmodels/location/location' }
        ]).buildNavigationModel();

我有一个这样的激活方法：

activate: function(paramX, paramY) {
    // TODO: set document title
    // TODO: do something with input params    
}

对于位置页面，文档标题设置为位置 | [我的应用程序名称]。我想将其更改为由位置页面的激活方法上的激活方法（paramX，paramY）中获取的参数组成。我该怎么做呢？

4

3 回答 3

10

您可以通过覆盖路由器进程的默认行为来设置标题来实现这一点。

导航完成后始终设置标题，因此之前已调用视图模型的激活方法。Durandal 2.0 中的当前实现是：

   router.updateDocumentTitle = function(instance, instruction) {
        if (instruction.config.title) {
            if (app.title) {
                document.title = instruction.config.title + " | " + app.title;
            } else {
                document.title = instruction.config.title;
            }
        } else if (app.title) {
            document.title = app.title;
        }
    };

这completeNavigation在router.js.

在instanceparam 中，您拥有要激活的 ViewModel，因此可能的解决方案是覆盖其中的updateDocumentTilte函数，shell.js或者main.js使用instance来获取您想要的值。例如你可以做这样的事情（确保你有app和router实例）：

 router.updateDocumentTitle = function (instance, instruction) {
            if (instance.setTitle)
                document.title = instance.setTitle();
            else if (instruction.config.title) {
                if (app.title) {
                    document.title = instruction.config.title + " | " + app.title;
                } else {
                    document.title = instruction.config.title;
                }
            } else if (app.title) {
                document.title = app.title;
            }
        };

在这段代码中，我们检查实例（当前 ViewModel）是否包含一个方法setTitle，如果是，那么我们得到调用该函数的标题。然后在我们的视图模型中，我们可以有类似的东西：

define(function () {

var id;
var vm = {
    activate: function (param) {
        id = param;
        return true;
    },
    setTitle: function () {
        return 'My new Title ' + id;  //Or whatever you want to return
    }
};

return vm;
});

如果您的视图模型不包含此方法，那么它应该属于当前行为。

于 2013-09-10T10:45:35.953 回答
3

这是我实现它的方法：

    activate: function (product, context) {
        // Update the title
        router.activeInstruction().config.title = "Buy " + product;
        ...
        ...
        ...
        ...

它有效，但我不知道这是否是批准的方法。

于 2014-02-13T20:52:01.693 回答
0

我需要为此使用 observables，因为标题派生的数据是由activate方法中的 AJAX 加载的。

所以我把它放在我的应用程序引导代码中：

var originalRouterUpdateDocumentTitle = router.updateDocumentTitle;
router.updateDocumentTitle = function (instance, instruction) {
    if (ko.isObservable(instance.documentTitle)) {
        instruction.config.title = instance.documentTitle;
    }
    return originalRouterUpdateDocumentTitle(instance, instruction);
};

如果视图模型有一个名为 的可观察documentTitle对象，则将其复制到instruction.config.title. 然后，这由 Durandal 绑定到实际document.title值（使用订阅），因此每当documentTitle可观察的值发生变化时，都会document.title发生变化。documentTitleobservable 可以是普通的 observable 或计算的 observable 。

这种方法还将大部分工作委托给实际router.updateDocumentTitle()方法，通过拦截和修改instruction基于的值instance，然后通过调用 to originalRouterUpdateDocumentTitle。

这适用于 Durandal 2.1.0。

于 2015-04-01T09:43:52.203 回答