2016-12-22 4 views
6

私は角2を学び、文字列を格納するためのベストプラクティスと考えられています。私は、アプリケーション全体でさまざまな文字列を使用します。いくつかは、例えば、HTML要素に直接配置され、角2の文字列のベストプラクティス

// sample.html 
<h1>This is my title</h1> 

他の文字列が私の懸念があることである

// boundSample.html 
<h1>{{myTitle}}</h1> 

// boundSample.component.ts 
import ... 

@Component({ 
    templateUrl: 'boundSample.html'; 
}) 
export class BoundSampleComponent { 
    myTitle = 'This is another title'; 
} 

、例えば、にバインドされているコンポーネントモデルに格納されています私の弦はアプリケーション全体に広がっています。 C#/ WPFの背景から、コードとUIマークアップ(つまり、XAML for WPF、HTML for Angular)にインポートできる単一の場所(たとえばstrings.xaml)に文字列を保持するのに使用します。これは保守性と国際化に大きく役立ちます。

さらに、角度2のinternationalizationのクイックルックは、i18n属性とi18n toolを使用することを示しています。これは、すべての文字列がHTMLで定義されていると仮定しますが、コード内でこれらの文字列の一部を使用したい場合はどうすればよいでしょうか...

Angular2の文字列には、コード内の文字列と国際化ツールを使用しますか?

+0

以下のローカリゼーションライブラリを使用して、後で何を達成するのに役立ちますか? https://github.com/robisim74/angular2localization/ – Peza

+0

代替案を追加するだけです。現在のプロジェクトではこのライブラリを使用しています:https://github.com/ocombe/ng2-translate/しかし、angle2localizationはかなり豊かな(肯定的な意味で)豊かに見えます。 – meistermeier

+0

https://angular.io/docs/ts/latest/cookbook/i18n.html –

答えて

2

いくつかのツールを検索することができます。そのうちのいくつかは良いものであり、必要なものを既に実装しています。 XAML/JSON/YAMLの/ etc、あなたの文字列を格納ファイルに

  1. ストアの文字列:しかし、あなただけの次の操作を行い、あなたがに使用方法をそれをしたい場合。あなたがwebpackを使用している場合は、あなたのためのものを処理する適切なローダーを使用してください。そうでない場合は、このファイルを自分で解析する必要があります。

  2. ファイルから(私が推測する)コンストラクタ内の情報を取得できるサービスを作成し、文字列トークンに基づいて文字列を返す関数があります。

  3. トークンに基づいて文字列を返すパイプを作成します。

  4. HTMLでパイプを使用し、typescriptファイルでサービスを使用します。

i18n - 問題はなく、サービス機能に言語を渡す/サービスで観察可能な言語変更を購読するだけです。

実装は簡単です。ただし、既存のソリューションを使用することができます。