当前位置: 首页 > 面试题库 >

如何在angularjs中的选择框选项内进行ng翻译

章宏恺
2023-03-14
问题内容

如何应用ng-translate来翻译选择框内的选项。
例如:

模板:

<select class="form-control" ng-model="me.gender" ng-options="gender.name for gender in genders">
</select>

控制器:

$scope.genders = [{code: "M", name:"TXT_MALE"}, {code: "F", name:"TXT_FEMALE"}]

enUS.json

{
    "TXT_MALE": "Male",
    "TXT_FEMALE": "Female",
}

我试过像这样添加过滤器,ng-options="gender.name for gender in genders | translate"
但很显然它是在向$scope.genders数组而不是单个元素添加过滤器

我尝试编写自己的过滤器(对此我是陌生的)

filter('translateArrayObj', ['$translate', '_', function($translate, _) {
  return function(arr) {
    var arr2 = [];
    angular.forEach(arr, function (value, key) {
      $translate(value.name).then(function(translation) {
        var obj2 = angular.copy(value);
        obj2.name = translation;
        obj2.code = value.code;
        arr2.push(obj2);
      });
    });
    return arr2;
  }
}])

但我得到以下错误

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!

这似乎是一个简单的任务,但已经用了我一半的时间,我在做什么错了:(


问题答案:

您需要将过滤器应用于gender.name而不是应用于genders数组:

<select ng-model="me.gender" ng-options="gender.name | translate for gender in genders"></select>

这是一个演示



 类似资料:
  • 问题内容: 我已经在其他帖子中阅读过,但是我无法弄清楚。 我有一个数组 我想将其呈现为: 我也想选择ID = 000002的选项。 我已经阅读了 select 并尝试过,但是我无法弄清楚。 问题答案: 要注意的一件事是ngOptions起作用 需要 ngModel。请注意,这是“将$ scope.blah设置为所选值”。 试试这个: 这里是AngularJS文档的更多内容(如果您还没有看过的话):

  • 问题内容: 我使用的选择标记的格式允许多次选择,但我希望选择的最大数量为10。使用JavaScript或jquery是否可以? 提前致谢! 问题答案: 这是供您使用的一些完整代码…一定要喜欢Google AJAX API Playground :-) 编辑1: 注意:这只允许您选择5,因为我不想复制/粘贴另外10个选项:-) ​

  • 我试图弄清楚如何在显示时选择一个选项,使用旧的javascript风格代码或其他语言,例如: 在angularjs中尝试这样做时,我最终得到了类似下面所示的东西。 这是代码: 如何才能正确地执行此操作?

  • 问题内容: 目前,我正在使用此: 它将我重定向到选项值内的位置。但这不能按预期工作。..这意味着如果我单击select的第一个选项,则onChange操作不会运行。我正在考虑使用javascript,但我想您会收到一些更好的建议。因此,如果我单击每个选项将其重定向到它的值,该如何使其起作用? 问题答案: 因为已经选择了第一个选项,所以永远不会触发change事件。添加一个空值作为第一个值,并检查位

  • 问题内容: 我想设置一个先前选择的要在页面加载时显示的选项。我用以下代码尝试了它: 与 但这是行不通的。有任何想法吗? 问题答案: 这绝对应该工作。确保已将代码放入:

  • 要组织和排列您的图稿,请使用工具以便精确地选择、放置和堆叠对象。您可以测量和对齐对象;编组对象以便能够将其视为一个单元进行操作;有选择地隔离、锁定或隐藏对象。 选区选项和首选项 用于选择对象的选项 在可以修改某个对象之前,需要将其与周围的对象区分开来。只需选择对象,即可加以区分。只要选择了对象或者对象的一部分,即可对其进行编辑。 Illustrator 提供以下选择方法和工具: 隔离模式 可让您快