angularjs动态加载json语言文件

时间:2015-05-28 12:25:14

标签: javascript json angularjs angular-translate

我是棱角分明的......:/

我想为每种语言加载一个不同的json文件...(json / Agenda-nl.json)

我该怎么做?现在我有2个控制器文件和2个不同的html文件来加载它们......我怎么能用它们加载它们......也许使用angular-translate模块?

提前感谢您的帮助

var App = angular.module('App',['pascalprecht.translate']);

App.config(function($translateProvider) {
    $translateProvider.translations('fr', {
        TYPE: 'Type',
        BUTTON_TEXT_FR: 'français',
        BUTTON_TEXT_NL: 'nederlands'
    })
        .translations('nl', {
            TYPE: 'Type',
            BUTTON_TEXT_FR: 'français',
            BUTTON_TEXT_NL: 'nederlands'
        });
    $translateProvider.preferredLanguage('fr');
});
App.controller('TranslateController', function($translate, $scope) {
    $scope.changeLanguage = function (langKey) {
        $translate.use(langKey);
    };
});

App.controller('AgendaListCtrl', ['$scope', '$http',
    function ($scope, $http) {
        $http.get('json/Agenda-nl.json').success(function(data) {
            $scope.courses = data;
        });
        $http.get('json/language.json').success(function(language) {
            $scope.language = language;
        });
        $http.get('load.php').success(function(loaded) {
            $scope.load = loaded;
        });            

        $scope.selectModel = '1';

        $scope.hover = function(course) {
            // Shows/hides the enroll button on hover
            return course.showOverlay = ! course.showOverlay;
         };

         // create a blank object to hold our form information
        // $scope will allow this to pass between controller and view
        $scope.formData = {}; 
        //$scope.data = {};

        //empty out msgs if errors remains on screen after registration
        //$scope.message = [];
        //$scope.errors = [];

        // process the form
        $scope.processForm = function() {
            console.log("----->Submitting Form");
            $scope.formData
            $http({
                url     : 'insert.php',
                method  : 'POST',
                data    : $.param($scope.formData),  // pass in data as strings
                headers : { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' }  // set the headers so angular passing info as form data (not request payload)
            })
            .success(function(data) { // form submitted succesfully, nothing to do with injected in db or not... normally will always go into this routine...
            console.log(data); // debug in console window

            if (!data.success) {
                // if not successful, bind errors to error variables
                $scope.errormessage = data.errors.message;
                console.log(data.errors.message);
            } else {
                        // if successful, bind success message to message
                        $scope.message = data.message;
                        console.log(data.message);
                        // empty out array when everything went well...
                        //$scope.formData = {};
                    }
            });
   //out
            // reset form when submitted:
            //$scope.formData = {};
            //$scope.register.$setPristine();
            //$scope.model='';
        };

    }
]);

1 个答案:

答案 0 :(得分:0)

你有可能use the loader concept吗?

我在App.config中使用这样的东西并且它运行良好:

$translatePartialLoaderProvider.addPart("agenda");
$translateProvider.useLoader('$translatePartialLoader', {
    urlTemplate: '/app/localization/agenda-{lang}/{part}.json'
})
.preferredLanguage('nl')
.useLocalStorage();
$translateProvider.fallbackLanguage('nl');

文件夹结构如下所示:

  

应用程序/定位/议程-NL / agenda.json

     

应用程序/定位/议程-FR / agenda.json

不同json文件的内容可能是:

{
    "AGENDA_TEXT": "Dit is jouw agenda tekst",
}

在您的应用程序中,您可以使用 AGENDA_TEXT 并依赖所选语言,您将获得翻译后的文本。

这是一个想法吗?