Durandal.js 2.0在activate方法中设置文档标题

在我的 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    
}

对于位置页面,文档标题设置为Location | [我的应用名称].我想将此更改为由激活方法(paramX,paramY)中的params组成,用于我的位置页面的activate方法.我该怎么做呢?

解决方法

您可以通过覆盖路由器进程的认行为来设置标题来实现此目的.

导航完成后始终设置标题,因此之前已调用viewmodel的activate方法. 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;
        }
    };

这在router.js中的方法completeNavigation中调用.

在实例param中,您具有要激活的viewmodel,因此可能的解决方案是覆盖shell.js或main.js中的updateDocumentTilte函数,并使用该实例获取所需的值.例如,你可以做这样的事情(确保你有应用程序和路由器实例):

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,如果是,那么我们得到调用函数标题.然后在我们的viewmodel中我们可以有类似的东西:

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;
});

如果您的viewmodel不包含此方法,那么它应该属于当前行为.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...