使用 Meteor 设置文档标题

Question

我刚开始使用 Meteor。在一个要本地化的应用中，我想设置文档标题。

我正在关注 advice given by Bernát

在我的准系统版本中，我只有 2 个文档：

head.html

<head>
  <meta charset="utf-8">
  <title>{{localizedTitle}}</title>
</head>

ui.js

UI.registerHelper("localizedTitle", function() {
  var title = "Localized Title"
  document.title = title;
});

应用加载时，文档标题为“{{localizedTitle}}”。如果我从控制台调用 UI._globalHelpers.localizedTitle()，则会显示正确的标题。

我需要做什么才能在加载页面时显示本地化标题？

编辑：这对我有用，但似乎有点麻烦。 title 模板除了渲染自身外什么都不做，实际上没有向界面添加任何内容。

body.html

<body>
{{> title}}
</body>

<template name="title">
</template>

title.js

Template.title.onRendered(function () {
  document.title = getLocalizedString()

  function getLocalizedString() {
    return "Title : in English"
  }
})

Answer 1

根据 Bernát 的回答，您的全局助手不应在头部的 <title> 标记中调用，而应在您希望具有给定标题的模板的 <template> 标记中调用。在 Meteor 中，<head> 不算作模板，因此您不能在其中使用空格键符号：它只会被视为简单文本。

此外，请记住，您的助手不会 return（即打印）页面上的任何内容。 document.title = "something" 直接将 "something" 分配给您的 ` 标签。所以不需要在里面调用你的助手！

因此，假设您想使用 localized 模板为页面设置 "Localized Title" 标题：

<template name="localized">
  <h1>This is the localized page</h1>
  {{localizedTitle}}
</template>

在这里，你的技巧应该奏效了。

Answer 2

我发现在 iron-router 路线的 onAfterAction 中设置标题很方便：

onAfterAction: function(){
  document.title = 'foo'; // ex: your site's name
  var routeName = Router.current().route.getName();
  if ( routeName ) document.title = document.title + ': ' + routeName;
}

Answer 3

我认为一个更优雅的解决方案是使标题具有反应性并通过 Session 变量进行设置（其他反应性数据源当然也可以）。像这样：

Template.body.onRendered(function() {
  this.autorun(function() {
    document.title = Session.get('documentTitle');
  });
});

现在每次使用

设置 'documentTitle' 变量

Session.set('documentTitle', 'Awesome title');

页面标题将更改。无需 hack，您可以在客户端代码中的任何位置执行此操作。

Answer 4

试试这个：

UI.registerHelper('title', function() {
 return 'LocalizedTitle'
});

我们可以随心所欲地使用标题

你可以这样使用{{title}}

使用 Meteor 设置文档标题

Setting the document title with Meteor

title

meteor

spacebars