如何在angular-translate中使用ng-if

Question

我正在写一个使用离子框架的移动应用，我也在使用angular-translate，它工作得很好，但我想根据用户的语言选择显示英语或西班牙语的内容。我正在尝试使用ng-if来验证条件，这是我代码的一部分：

      <div  class="tit" ng-if=" {{'LANGUAGE' | translate}} == en ">
         {{adult.desdeAct}} - {{adult.titleAct}}
  </div>
     </div>
     <div  class="tit" ng-if=" 'LANGUAGE' | translate == sp ">
        <div  class="tit">
         {{adult.desdeAct}} - {{adult.titleActEs}}
  </div>
     </div>

但是ng-if不工作，我的意思是没有验证表达式。有谁能给我小费吗？

致以问候，caribesoft

Answer 1

这并不是你应该如何使用翻译的。我们的想法是使用一段HTML代码，并为您想要支持的语言创建键/值字典：

根据他们的docs guide，你会得到类似这样的结果：

app.config(['$translateProvider', function ($translateProvider) {
  $translateProvider.translations('en', {
    'LANGUAGE': 'Hello'
  });

  $translateProvider.translations('sp', {
    'LANGUAGE': 'Hola'
  });

  $translateProvider.preferredLanguage('en');
}]);

现在，在设置了LANGUAGE的值之后，您可以这样做：

<div  class="tit">
    {{'LANGUAGE' | translate}}
</div>

Answer 2

我还做了一个有两种语言的应用程序:英语和希腊语，我使用了一种不同的方式在语言之间切换。你可以用这种方式来代替使用ng-if来进行语言切换。

对div中的文本使用{{'KEYTEXT' | translate}}，并在转换表中添加这些键及其值。

作为，

<div  class="tit" >
      <1--here will be Text -->
      {{'KEYTEXT' | translate}}
 </div>

在你的英语翻译表中

{
 "KEYTEXT" : 'English Text'
}

在你的西班牙语翻译表中

{
 "KEYTEXT" : 'Spanish Text'
}

Answer 3

您应该使用全局变量并根据您的用户选择为其赋值，例如"en“或"sp”，然后根据选择显示相应的语言，如下所示：

if(user selects spanish) {
     GlobalVariable = "sp";
     $translateProvider.preferredLanguage(GlobalVariable);
}

<div  class="tit" ng-if="GlobalVariable == 'sp' ">
          {{{{'LANGUAGE' | translate}} }}
     </div>

您也可以查看@Omri Aharon answer来更好地理解。