10

angular-translate の使用に興味があります。

起動時に最初に発生するセットアップ呼び出しが多いため、構成中に言語 json を提供できません。また、非同期ローダーを使用することもできません。後でコントローラーまたはサービスから言語を指定できるようにする必要があります。

$translateProvider.translations(.., ...)使用する呼び出し$translateProviderですが、コントローラーまたはサービスでは使用できませんが、config でのみ使用できるようです。

$translate言語 JSON をロードする機能がないようです。

回避策はありますか?

4

5 に答える 5

21

最初$translateにコントローラーに注入します。

app.controller('MainCtrl', function($scope, $state, $translate) {});

次に、を使用して現在の言語を取得および設定できます$translate.use()

var lang = $translate.use(); // holds current lang
$translate.use(lang);  // sets lang to use

 

構成後に新しい翻訳を追加する必要がある場合は、部分ローダーを使用できます。

// config example
app.config(function($translateProvider, $translatePartialLoaderProvider){
  // "known" translations here, in {lang}.main.json, if any
  $translatePartialLoaderProvider.addPart('main'); 
  $translateProvider.useLoader('$translatePartialLoader', {
    urlTemplate: '/path/to/files/{lang}.{part}.json'
  });
});

// controller
app.controller('MainCtrl', function($scope, $translate, $translatePartialLoader){
  $translatePartialLoader.addPart('translation');
  $translate.refresh();
  $translate.use('en');
});

// en.translation.json
{ "KEY" : "Value", ... }

 

それが十分に動的でない場合は、いつでもその場で翻訳を行うことができます。

// config
app.config(function($translateProvider, $translatePartialLoaderProvider){
    $translateProvider.preferredLanguage('en');
    $translateProvider.translations('en',{
      'TITLE': '{{ title }}',
      'SUBTITLE': '{{ subtitle }}',
      'STATIC': 'This is static'
    });
});

// controller
app.controller('MainCtrl', function($scope, $translate){
  $scope.dynamic = {
    'title': 'This is my header',
    'subtitle': 'My subtitle'
  };
});

// template
<pre>{{ 'TITLE' | translate:dynamic }}</pre>
<pre>{{ 'SUBTITLE' | translate:dynamic }}</pre>
<pre>{{ 'STATIC' | translate }}</pre>

これは次のようなものを吐き出します

ここに画像の説明を入力

于 2014-09-11T08:32:49.100 に答える
2

多分これをチェックしてください:

http://www.ng-newsletter.com/posts/angular-translate.html

「実行時の言語の切り替え」の下

$translate.use(); // Returns the currently used language key
$translate.use('en'); // Sets the active language to `en`

app.controller('TranslateController', function($translate, $scope) {
  $scope.changeLanguage = function (langKey) {
    $translate.use(langKey);
  };
});
于 2014-09-11T08:31:36.497 に答える
0

動的な読み込みを管理する最善の方法は、次のような解決構成ルーター ブロックにあると思います

resolve: {
    translatePartialLoader:  function loadPartialLoader($translate,$translatePartialLoader) {
        $translatePartialLoader.addPart('home');
        return $translate.refresh();
    }
}
于 2015-12-20T21:46:41.823 に答える