web-dev-qa-db-ja.com

Meteor-ドキュメントタイトルの設定

Meteorアプリの<title>要素を変更する方法はありますか?テンプレートは<body>でのみ処理されるようです。

41
Dean Brundage

クライアント側のJavaScriptコードのほぼどこにでも:

document.title = "My new title";
43
David Wihl

DavidWihlのソリューションを拡張できます。

Deps.autorun(function(){
  document.title = Session.get("DocumentTitle");
});

その後、いつでも電話をかけることができます:

Session.set("DocumentTitle","New Document Title");
38
KNOFF

iron:router を使用する場合は、パッケージ manuelschoebel:ms-seo を追加して、メタタグとともにタイトルを処理できます。これは、静的および動的なSEOデータに役立ちます。

Router.map(function() {
  return this.route('blogPost', {
    path: '/blog/:slug',

    onAfterAction: function() {
      var post = this.data().post;
      SEO.set({
        title: post.title,
        meta: {
          'description': post.description
        },
        og: {
          'title': post.title,
          'description': post.description
        }
      });
    }
  });
});
12
jrbedard

タイトルを設定するためのヘルパー(CoffeeScript)を作成できます。

UI.registerHelper "setTitle", ->
  title = ""
  for i in [0..arguments.length-2]
    title += arguments[i]
  document.title = title
  undefined

またはJsで同じ:

UI.registerHelper("setTitle", function() {
  var title = "";
  for (var i = 0; i < arguments.length - 1; ++i) {
    title += arguments[i];
  }
  document.title = title;
});

次に、それを複雑な方法で使用でき、反応します。

{{#if book}}
  {{setTitle book.title}}
{{else}}
  {{setTitle "My books"}}
{{/if}}
10
Bernát

onBeforeActionを使用して、ルーターで直接そのようなことを処理する方が便利だと思います。

Router.map(function() {
  return this.route('StudioRoot', {
    path: '/',
    onBeforeAction: function() {
      return document.title = "My Awesome Meteor Application";
    }
  });
});
7

テンプレートに存在しない<head> </head>タグに含めることもできます。これを試して:

sample.htmlの内容:

<head>
    <title>my title</title>
</head>

<body>
    ...
</body>

<template name="mytemplate">
    ...
</template>
4
gbaydar

私がやったこと:

meteor.isClient内:

Meteor.startup(function() {
    Deps.autorun(function() {
        document.title = Session.get('documentTitle');
    });
});

varがリアクティブに設定されたので、ルーターファイルに移動します(まだ行われていない場合:meteor add iron:router。私のルーターファイルはクライアントとサーバーの両方です)

Router.route('/', {
    name: 'nameOfYourTemplate',
    onBeforeAction: function () {
        Session.set('documentTitle', 'whateverTitleIWant');
        this.next();    //Otherwise I would get no template displayed
    }
});

すでにheadタグにタイトルを設定しているかどうかは関係ありません。ルートに応じてこちらに置き換わります。

1
Leths