4

アプリケーションの言語を最初に変更すると、翻訳サービスが新しい言語を表すファイルを要求します。「スマート」コンポーネントの文字列は更新を正しく反映しますが、「純粋/ダム」コンポーネントは反映されず、以前の言語。ただし、新しい言語ファイルがキャッシュに読み込まれ、言語を変更し続けると、すべて正常に動作するように見えます。

純粋なコンポーネントは、新しい言語ファイルの ajax 応答からの更新を解決していないようです。ファイルが既にキャッシュに読み込まれている場合にのみ、言語が正しく変更されます。繰り返しますが、これは ChangeDetectionStrategy.OnPush を使用しているコンポーネント専用です。

ダム コンポーネントで Inputs と Observables を使用して changeDetection を理解していますが、この場合のパイプに関してはあまり詳しくありません。おそらく私は何かを逃していますか？

UDPATE

私はなんとか修正をハックしました。それは素晴らしいものではありませんが、機能します。これは、翻訳サービスをラップする私のサービスのコンストラクターです。

選択しようとしている言語の言語 json ファイルが既にキャッシュにあるかどうかを確認します。持っていない場合は、ng2-translate の「reloadLang」メソッドを使用して取得します。取得したら、空のタイムアウトを使用してから、「translate.use」を呼び出します。タイムアウトを取ると機能しないため、どこかにタイミングの問題があります。切り替えようとしている翻訳ファイルが既にある場合は、通常どおり translate.use を使用するだけで、すべて正常に動作します。

constructor(private translate: TranslateService, public store: Store<any>) {
// this language will be used as a fallback when a translation isn't found in the current language
translate.setDefaultLang('en');
// subscribe to changes
store.select('i18n').subscribe((state: MultilingualStateI) => {
  // update ng2-translate which will cause translations to occur wherever the TranslatePipe is used in the view
  if (this.translate.getLangs() && (this.translate.getLangs().indexOf(state.lang) > -1)) {
    this.translate.use(state.lang)
  } else {
    this.translate.reloadLang(state.lang).take(1).subscribe(() => {
      setTimeout(() => this.translate.use(state.lang), 0);
    });
  }
});

}

ここで何が起こっているのか完全にはわかりませんが、ChangeDetectionStrategy.OnPush の使用と、翻訳ファイルの要求からの新しい応答が混在しているようです。他の誰かがこれを見ている場合は、あなたの意見を追加してください。

4

1 に答える 1

4

私はこの問題に悩まされていました。いくつかのグラフがあり (私は を使用していますng2-charts)、言語を変更すると (たとえば からenにes)、チャート関連以外のすべてのラベルが更新されました。グラフを新しい言語で更新するには、言語をもう一度変更する必要がありましたes(最初にダブルクリックして言語を変更します)。

あなたの問題と回避策を読んだ後、私はそれをチェックしました。あなたが指摘したように、問題はキャッシュです。初めて言語を変更すると、JSON が読み込まれますが、キャッシュにないため、すべてのコンポーネントが翻訳されるわけではありません (私の場合、チャートは適切に更新されませんでした)。2 回目に同じ言語に変更すると、ラベルは既にキャッシュにあるため、適切に機能します。

サービスを初期化するときに、使用可能なすべての言語をロードして修正しました。

constructor(private translate: TranslateService) {
    var navigatorLanguage = (window.navigator.userLanguage || window.navigator.language).toLowerCase().split("-")[0];
    // this language will be used as a fallback when a translation isn't found in the current language
    translate.setDefaultLang(navigatorLanguage);
    // the lang to use, if the lang isn't available, it will use the current loader to get them
    translate.use(navigatorLanguage)
    // Hack to load all languages
    // If we don't do this, the first time we change language not all elements are properly translated
    translate.reloadLang('en')
    translate.reloadLang('es')
}

私の場合、これらの 2 つの言語しかありません。もっとある場合は、すべての言語をリロードするのにいくつかの for ループが役立つかもしれません:)

于 2016-10-11T09:26:35.093 に答える