Как получить угловой перевод в отдельных файлах

В настоящее время я пытаюсь применить angular-translate к моему проекту. Проблема в том, что я не хочу, чтобы мой app.js был заполнен переводами, я бы предпочел, чтобы он был в отдельных файлах в папке перевода.

Структура моего проекта выглядит примерно так:

wwwroot
-- css
-- images
-- js
 --- controllers
 --- directives
 --- filters
 --- services
 --- app.js
-- resources
 --- locale-nl.json
 --- translate.js
-- views

Мой app.js выглядит примерно так:

angular.module('testApp', ['ngRoute', 'ngResource', 'ui.bootstrap', 'ngAnimate', 'angular-loading-bar', 'smart-table', 'pascalprecht.translate']);

Мой файл translate.js выглядит так:

angular.module("testApp").config([
    "$translateProvider", function ($translateProvider) {
        $translateProvider.useLocalStorage();
        $translateProvider.useStaticFilesLoader({
            prefix: "resources/locale-",
            suffix: ".json"
        });
        $translateProvider.preferredLanguage("nl");
    }
]);

Локаль-nl.json выглядит так:

{
  "FOO": "This is a paragraph",
  "TITLE": "Helloooo"
}

В моем main.html у меня есть нормальное значение перевода:

{{ 'TITLE' | translate }}

и в моем mainController у меня есть это:

"use strict";

angular.module("testApp")
    .controller("MainController", function ($scope, $translate, userRole) {
        var vm = this;
        vm.role = userRole;
        console.log(vm.role);
    });

Но, похоже, ничего не переводится и не просматривается в разных файлах.


person Jordec    schedule 31.05.2016    source источник
comment
Я использую $translatePartialLoader, так что это не совсем то же самое, но в файле я могу использовать folder/fileBegining-{lang}.json, и он автоматически заменяет {lang}. Обратите внимание, что язык может быть в локали (например, синтаксис en_GB)   -  person Neozaru    schedule 31.05.2016
comment
Можно ли показать мне немного кода, как это сделать? И есть ли другая разница между моей техникой, кроме наличия переменной в моем URL-адресе json?   -  person Jordec    schedule 31.05.2016


Ответы (2)


Добавьте registerAvailableLanguageKeys в свой код в соответствии с языковым ключом, объявленным для каждого статического файла:

angular.module("testApp").config([
    "$translateProvider", function ($translateProvider) {
        $translateProvider.useLocalStorage();
        $translateProvider.registerAvailableLanguageKeys(['en', 'de', 'nl',    
        etc..]);
        $translateProvider.useStaticFilesLoader({
            prefix: "resources/locale-",
            suffix: ".json"
        });
        $translateProvider.preferredLanguage("nl");
    }
]);
person AranS    schedule 31.05.2016
comment
Добавить это куда? что-то еще нужно удалить? Будет понятнее, если вы включите в нее полную функцию с этой строкой. таким образом, никто не должен был бы догадываться, что вы имели в виду - person Thatkookooguy; 31.05.2016
comment
Я попробовал ваше решение, но по какой-то причине мои слова все еще не переводятся. Я тоже не получаю сообщений об ошибках - person Jordec; 31.05.2016
comment
можете ли вы показать в коде, как вы используете $translateLocalStorage? - person AranS; 31.05.2016

В свой файл gulp я включил все свои файлы .js из папки js. Translate.js находился за пределами моей папки js.
Я переместил файл translation.js в свою папку js, и теперь он работает.

person Jordec    schedule 31.05.2016