ローカリゼーションの機能はプレリリースです。APIは変更されることがあります。
Polymer.AppLocalizeBehaviorは、アプリケーションの国際化をサポートするformat.jsライブラリをラップしています。Intlオブジェクトをネイティブにサポートしていないブラウザを使用している場合は、**自分でポリフィルを読み込む必要があります。**polyfillの利用例は、Intl.jsを参照してください。
Polymer.AppLocalizeBehaviorは、format.jsとまったく同じメッセージ構文をサポートしています。利用可能なメッセージ形式とオプションのリファレンスはformat.jsライブラリのドキュメントを参照してください。
コンテンツをローカライズして表示する要素には、それぞれPolymer.AppLocalizeBehaviorを追加する必要があります。これらの要素はすべて共通のローカリゼーションキャッシュを共有しており、翻訳は一度読む込むだけで済みます。
Polymer 1.x要素とPolymer 2.xのハイブリッド要素では、AppLocalizeBehaviorを直接使用できます。クラススタイルの要素の場合は、mixinBehaviorsメソッドを使用します。
AppLocalizeBehaviorをインストール
2.0リリース候補(RC)の場合は、2.0-previewブランチを使用します。：
bower install --save PolymerElements/app-localize-behavior#2.0-preview
アプリケーションにローカリゼーションを追加
通常、メインアプリケーションが、ローカライズされたメッセージのロードと言語環境の設定を担います。
サンプルアプリケーション(クラススタイル要素)
<dom-module id="x-app">
<template>
<!-- use the localize method to localize text -->
<div>{{localize('hello', 'name', 'Batman')}}</div>
</template>
<script>
class XApp extends Polymer.mixinBehaviors([Polymer.AppLocalizeBehavior], Polymer.Element) {
static get is() { return 'x-app'}
static get properties() {
return {
// set the current language—shared across all elements in the app
// that use AppLocalizeBehavior
language: {
value: 'en'
},
// Initialize locale data
resources: {
value() {
return {
'en': { 'hello': 'My name is {name}.' },
'fr': { 'hello': 'Je m\'apelle {name}.' }
}
}
}
};
}
}
customElements.define(XApp.is, XApp);
</script>
</dom-module>
一般的には、次の例に示すように、アプリケーションは外部ファイルからリソースをロードします。
サンプルアプリケーション(ハイブリッド要素)
<dom-module id="x-app">
<template>
<!-- use the localize method to localize text -->
<div>{{localize('hello', 'name', 'Batman')}}</div>
</template>
<script>
Polymer({
is: "x-app",
// include the behavior
behaviors: [
Polymer.AppLocalizeBehavior
],
// set the current language—shared across all elements in the app
// that use AppLocalizeBehavior
properties: {
language: {
value: 'en'
},
}
// load localized messages
attached: function() {
this.loadResources(this.resolveUrl('locales.json'));
},
});
</script>
</dom-module>
メインアプリケーションは、ポリフィルIntlの読み込みも担います。(上記には示されていません)
メッセージをローカライズする必要がある要素には、それぞれPolymer.AppLocalizeBehaviorを追加し、上記のようにlocalizeメソッドを使用して文字列を変換する必要があります。