Ionic App之国际化(2) json数组的处理

Ionic App值国际化(1)中我们实现了对单个参数的多语言处理,下面开始如何进行数组的处理。

1.在我们的多语言文件中设置要访问的json数组,en.json和zh.json,此处就以en.json中的MyLa为例

{
  "LOGIN_REGISTER": "Login/Register",
  "A" : "电动自行车A",
  "B" : "电动三轮车B",
  "MyLa":
  {
    "length" : 2,
   "values":[
    {
      "name" : "Huanhuan","value" : "1"
    },
    {
      "name" : "Alex","value" : "2"
    }
  ]
  }
}

2.在view页面中访问MyLa下的values数组。本以为可以像一般的ng-repeate="v in MyLa.Values"这样去访问,可以多语言不支持直接访问数组,应该如下:

<ion-list ng-init="items = [0,1]">
  <ion-item ng-repeat="item in items">
    <h2>
      {{ 'MyLa.values.'+item+'.name'  | translate }}
    </h2>
  </ion-item>
</ion-list>

格式竟然是:MyLa.values.下标.属性名,仔细想想应该是在app.config函数中解析的时候,事先就是按这种模式处理的,以后用的时候就可以加载了。

虽然这样可以实现多语言的效果,但却需要单独的设置下标数组,本想在多语言文件中增加一个参数length 动态生成数组下标,无奈没成功。下面的代码(没成功)

<ion-list ng-init="items = getItems({{MyLa.length | translate }})"> 
<ion-item ng-repeat="item in items">
<h2>
{{
'MyLa.values.'+item+'.name' | translate }}
</h2>
</ion-item>
</ion-list>
    $scope.getItems = function( len)
    {
       var push = [];
       for(var i =0 ; i< len;i++)
{
           
push.push(i);
            }
return push; }

此处主要是想把参数MyLa.length作为参数传给函数getItems获取数组下标素组,这样我们只需要在多语言文件中维护数据即可。

另外一种数组多语言的实现方式:

1.我们需要引入另外我们正常数据的json文件,读取的内容如下:

{
    "cars":[
        {"name":"A","value":"24"},
        {"name":"B","value":"93"}
    ]
}

2.在en.json和zh.json文件中分别设置A,B对应的多语言,在前面的en.json中已经添加了。

3.在controller的方法中实现语言的翻译:

        UserService.getCars().then(function(o)
        {
            $scope.carts = o.cars;
            angular.forEach($scope.carts, function(type, index)
            {
                $translate(type.name, {type: type}).then(function(translated)
                {
                    $scope.carts[index].name = translated;
                });
            });
        });

此方法将数组对应的值转化为了单个读多语言参数,然后再controller中处理。

这种方法多出两步,1是要引入多语言之外的一个json文件,2是要在contoller中实现翻译。

两种方法似乎都不太完美,还未发现更优雅的出路方式。

原文地址:https://www.cnblogs.com/crazyguo/p/6085465.html