AngularJS

Question

我有以下数组：

vm.roles = ['ROLE1', 'ROLE2', 'ROLE3', 'ROLE4'];

我需要这种形式的数组：

vm.translatedRoles = [{id:0, label:'Role1'}, {id:1, label:'Role2'}, ...]

所以我写了这个函数从vm.roles转移到vm.translatedRoles。我现在的问题是 translatedRoles 保持为空，因此其中没有对象。有谁知道为什么？

function translateRoles() {
        var translatedRoles = [];
        for(var i = 0; i < vm.roles.length; i++) {
            $translate(vm.roles[i]).then(function(text) {
                var role = {};
                role.id = i;
                role.label = text;
                translatedRoles.push(role);
            });
        }
        return translatedRoles;
    }

Answer 1

那不行。 $translate() return 是一个承诺。当翻译可用时，传递给 $translate 的函数将稍后、异步执行。因此，return 语句发生在之前 translatedRoles 由函数填充。

您需要 return 数组的承诺，或者希望翻译已经可用并使用 $translate.instant():

function translateRoles() {
    var translatedRoles = [];
    for (var i = 0; i < vm.roles.length; i++) {
        translatedRoles.push({
          id: i,
          label: $translate.instant(vm.roles[i]);
        });
    }
    return translatedRoles;
}

AngularJS - 创建标签为 $translated 的对象数组

AngularJS - create object array where label is $translated

translate