Javascript 将值追加到Aurelia router config.title

我想为我的Aurelia应用程序设置一个基本标题值，然后根据活动的路由向其附加一个值

我的路由器配置是：

export class App {
    configureRouter(config, router) {
        config.title = 'Brandon Taylor | Web Developer | Graphic Designer';
        config.map([
            . . .
            { route: 'work', name: 'work', moduleId: 'work', nav: true, title: ' | work' },
            . . .
        ]);

        this.router = router;
    }
}

Aurelia想将

title

导航参数附加到

config.title

的开头，但我希望它位于结尾

我已尝试在视图模型中执行替代：

export class Work {
    activate(params, routeConfig, navigationInstruction) {
        routeConfig.navModel.router.title += ' | work';
    };
}

但这导致：

Brandon Taylor | Web Developer | Graphic Designer | work | work | work ...

Graphic Designer | Web Developer | Brandon Taylor | about

---

在每个路由请求上。我做错了什么？或者，我如何将route

title

属性附加到

config.title

的末尾而不是开头？

我知道上面的代码是一个~dirty~解决方法，但也许可以帮助您，直到您找到一种从Aurelia支持获得所需内容的漂亮方法

你不能：

export class App {
    configureRouter(config, router) {
        const title = 'Brandon Taylor | Web Developer | Graphic Designer';
        config.title = '';
        var configMap = [
            . . .
            { route: 'work', name: 'work', moduleId: 'work', nav: true, title: ' | work' },
            . . .
        ];
        configMap.forEach(item => item.title = title + item.title);

        config.map(configMap);    
        this.router = router;
    }
}

---

Aurelia的标准标题逻辑将路由标题前置到外部路由/路由器的标题。例如，在skeleton navigation应用程序中，应用程序路由器的标题是Aurelia。github用户路由的标题在路由器标题前面，路由器标题生成

github用户| Aurelia

。如果要导航到子路由器页面，标题将更新为

Welcome | child router | Aurelia

。

如果我理解正确的话，你会希望这个逻辑颠倒过来。本例中的期望结果是

Aurelia |子路由器|欢迎

标题构建逻辑驻留在类的

buildTitle

方法中

通过将以下内容添加到main.js，可以覆盖此方法：

//导入NavigationContext类。它包含以下方法：
//建立标题。
从“aurelia路由器”导入{NavigationContext}；
//重命名标准的“buildTitle”方法。
NavigationContext.prototype.standardBuildTitle=NavigationContext.prototype.buildTitle；
//将标准的“buildTitle”方法替换为
//反转标题部分的顺序。
函数buildTitle（分隔符=“|”）{
设standardTitle=this.standardBuildTitle（分隔符）；
返回standardTitle.split（分隔符）.reverse（）.join（分隔符）；
}
NavigationContext.prototype.buildTitle=buildTitle；

最终结果如下所示：

---

谢谢你为我指明了正确的方向@Jeremy Danyow

我最终得到的是：

import {NavigationContext} from 'aurelia-router';

NavigationContext.prototype.standardBuildTitle = NavigationContext.prototype.buildTitle;

function buildTitle(separator=' | ') {
    var titleValues = this.standardBuildTitle(separator).split(separator),
        routeTitle = titleValues[0],
        configTitle = titleValues.slice(1);
    configTitle.push(routeTitle);
    return configTitle.join(separator);
}

NavigationContext.prototype.buildTitle = buildTitle;

理由是：

config.title = 'Brandon Taylor | Web Developer | Graphic Designer'

并致电：

return standardTitle.split(separator).reverse().join(separator);

结果：

Brandon Taylor | Web Developer | Graphic Designer | work | work | work ...

Graphic Designer | Web Developer | Brandon Taylor | about

而不是：

Brandon Taylor | Web Developer | Graphic Designer | about

---

更好的问题是为什么激活被调用了三次。@AshleyGrant我应该使用另一个回调吗？我刚开始跟奥雷莉亚谈。谢谢。不，你找对地方了。但是，如果一条路线被多次激活，则会出现更大的问题。首先，在激活回调中放置一个断点，看看发生了什么以及原因。@MatthewJamesDavis关于为什么会多次调用

activate（）

，我在寻找什么？如果I

console.log（'activate called'）在方法本身内部，导航到路线、导航离开和导航返回，我看到多个日志语句。如果没有一些代码可以查看，很难说。你问过gitter频道的人吗？聪明：）这对静态标题非常有效，但对视图中的动态值无效。非常接近！配置标题的单词顺序颠倒。请参阅我的答案。这现在在导航说明中，方法是“buildTitle:您确定
\u buildTitle
是供公众使用的吗？警察没有提到这件事。