Лучшая практика для js i18n с угловым

Интересно, есть ли какой-нибудь неприятный запах в моей практике для i18n на Angular.

Я поставил функцию перевода I18n на контроллер Angular (потому что я не знаю, как поместить ее в файл шаблона HTML)

Что касается области i18n, я использую этот способ I18n.t("city." + city_name), чтобы указать, что имя города находится в области действия «город». Могу я написать так I18n.t(city_name, scope: "city"), чтобы было понятнее.

Я ценю каждый комментарий и предложение по улучшению моего текущего решения.

Структура данных

отправления_lst — это список названий стран на английском языке, например: [США, Китай, Япония]

Каждая страна имеет много названий городов. например [Нью-Йорк, Лос-Анджелес, Бостон]

Угловой контроллер

App.controller("departures_ctrl", function($scope, $location, $http) {
    $http.get("/departures.json")
    .success(function (response) {
      $scope.departures_lst = response;
    });
    $scope.get_destinations = function(city_name) {
          return $location.url("/depart_from/" + city_name);
    };
    $scope.i18nCountryName = function(country_name) {
          return I18n.t("country." + country_name) + country_name
    };
    $scope.i18nCityName = function(city_name) {
          return I18n.t("city." + city_name) + city_name
    };
});

Табличка HTML?

<div class="panel panel-transparent" ng-repeat="departure in departures_lst">
    <h5>{{i18nCountryName(departure.country)}}</h5>
    <li class="col-sm-3 col-lg-3 col-xs-3" ng-repeat="city in departure.cities">
      <a ng-click="get_destinations(city)">
        <i class="fa fa-plane"></i>
        {{i18nCityName(city)}}
      </a>
    </li>
</div>

person newBike    schedule 12.02.2016    source источник
comment
это, вероятно, лучше на Code Review   -  person DrewJordan    schedule 12.02.2016


Ответы (1)


Вы всегда должны стараться помещать локализацию в разметку (насколько это возможно), таким образом вы дополнительно инкапсулируете макет из своей логики и данных. Я всегда использовал отличный подключаемый модуль angular-localization. У вас есть несколько отличных фильтров и директив, с которыми можно играть, в которые встроены параметризация и другие функции. Например:

У вас есть строка, в которую вы должны вставить имя пользователя, вы определяете строку в своем локализованном файле как:

"some-loc-id-tag": "insert the user name {user} here!"

И в области вашего контроллера есть свойство:

$scope.model.userName

И может отображать имя пользователя с локализованной строкой, как в HTML:

<div data-i18n="loc.some-loc-id-tag" data-user="{{model.userName}}"></div>

Проверьте это: https://github.com/doshprompt/angular-localization

person Amonn    schedule 12.02.2016