1

angualr-translate 与 requirejs 一起使用。想要为每种语言创建单独的文件(包含翻译键),暂时都在 app.js 中。

示例- app.js

    define(['angularAMD', 'ngRoute','pascalprecht.translate'], function (angularAMD) {
    var app = angular.module('app', ['ngRoute','pascalprecht.translate']);  
    app.config(['$routeProvider','$translateProvider', function($routeProvider,$translateProvider){
    /* *************** routes *************** */
    //...........
    /* *************** routes *************** */
    /* angular translate */
             $translateProvider.translations('en', { 
                add_user: 'Add User',
                first_name:'First Name',
                last_name:'Last Name',
                //.....
                //IMPORTANT: more than 1000 translate keys...
                //.....
            });
            $translateProvider.translations('de', {
                add_user: 'Benutzer hinzufügen',
                first_name:'Vorname',
                last_name:'Last Name',
                //.....
                //IMPORTANT: more than 1000 translate keys...
                //.....
            });
     // Bootstrap Angular when DOM is ready
        return angularAMD.bootstrap(app);

    });
4

1 回答 1

0

如果您想使用 js 而不是 JSON。

var app = angular.module('myModule', []);

app.config(function ($translateProvider) {
  $translateProvider.useLoader('customLoader', {
     // if you have some custom properties, go for it!
  });
});

app.factory('customLoader', function ($http, $q) {
    // return loaderFn
    return function (options) {
        var deferred = $q.defer();
        // do something with $http, $q and key to load localization files
        // or do something to load file with requireJS
        require(['en-US'], function(translation){
          var data = translation;
        }

        return deferred.resolve(data);
        // or
        return deferred.reject(options.key);
    };
});

这是答案末尾的异步加载首选项链接中的修改示例(部分Using custom loader service

旧答案

angular-translate支持按需加载翻译文件。在这种情况下,您不需要使用 requireJS。

目前这是我的代码app.config()

$translateProvider.useUrlLoader('/translate');
$translateProvider.preferredLanguage('en');
$translateProvider.fallbackLanguage('en');

您需要做的就是设置如下网址

{your_host}/something-translate?lang={language_key}

就我而言,服务器真实网址就像。

localhost/translate?lang=en

localhost/translate?lang=fr

localhost/translate?lang=es

...

然后在控制器中:

$scope.translate = function (langKey){
    $translate.use(langKey);
}

偏好链接:

https://github.com/angular-translate/angular-translate/wiki/Asynchronous-loading#registering-asynchronous-loaders

https://github.com/angular-translate/angular-translate/wiki/Extensions

于 2015-07-17T04:52:38.140 回答