数据结构

Question

我想知道我在Angular上练习i18n是否有任何难闻的气味。

我把I18n翻译功能放在Angular控制器上（因为我不知道如何将它放在HTML模板文件中）

关于i18n范围，我使用这种方式I18n.t("city." + city_name)来表示city_name位于＆＃34; city＆＃34;范围。我可以用这种方式写I18n.t(city_name, scope: "city")以使其更容易理解。

我感谢每一条评论和建议，以加强我目前的解决方案。

数据结构

departures_lst是一个国家列表＆＃39;英文名称，例如：[美国，中国，日本]

每个国家都有许多城市名称。例如[纽约，洛杉矶，波士顿]

角度控制器

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 teamplate？

<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>

Answer 1

您应该始终尝试将本地化放在标记中（尽可能多），这样您就可以从逻辑和数据中进一步封装布局。我一直使用伟大的角度定位插件。你可以得到一些很好的过滤器和指令，它们具有参数化和内置的其他功能。例如：

您有一个字符串，您必须在其中插入用户名，您可以在本地化文件中将字符串定义为：

"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

更好地练习js i18n的角度

数据结构

角度控制器

HTML teamplate？

1 个答案: