如何在AngularJS中按值对字典进行排序

Question

我有一个REST api，返回字典形式的语言环境列表：

{
"en-uk": "English UK",
"en-us": "English USA",
...
}

这个字典按值的字母顺序正确排序。

当AngularJS通过HTTP接收它时，字典会自动按键重新排序，因此当我将选项列表绑定到选择元素时，选项列表按键排序，并且按键的字母顺序与值的顺序不匹配，导致排序错误。

我想问题是由于这种字典基本上成为具有800多个属性的一个对象。如何按值对其进行排序？

- CodeClimber

---

请提供代码。 - I. Ahmed

Answer 1

首先：你需要找到所有的键。

其次：遍历所有的键。

最后：按照值对数组进行排序。

请使用以下内容：

let obj = {
"en-us": "English USA",
"en-uk": "English UK"
};

// Get an array of the keys:
let keys = Object.keys(obj);

// Then sort by using the keys to lookup the values in the original object:
keys.sort(function(a, b) { return obj[a] > obj[b] });

console.log(keys);
console.log(obj[keys[0]]);

- I. Ahmed

---

我需要将它绑定到一个选择器上，因此我将其转换为对象数组。 - CodeClimber

如果你需要数组，那么你可以进行转换。 - I. Ahmed

Answer 2

问题确实是您无法对对象的属性值进行排序。因此，在绑定之前，我将其转换为数组：

所以，

languageResource.getCultures().then(function(cultures) {   
       vm.availableCultures = cultures;
});

变成

languageResource.getCultures().then(function (culturesDictionary) {
                        var cultures = [];
                        angular.forEach(culturesDictionary, function (value, key) {
                            cultures.push({
                                lcid: key,
                                name: value
                            });
                        });
                        vm.availableCultures = cultures;
                    });

- CodeClimber

Answer 3

您可以修改从服务器发送响应的方式。不要将响应作为对象发送，而是发送字符串化的对象。

- Abhishek Singh

---

很遗憾，我无法更改服务器的响应。 - CodeClimber

Answer 4

当键为数字时会出现此情况。 如果键的数据类型为字符串，则在 API 调用后它将保持其排序状态。 如果键的数据类型为数字，则需要将键的值设置为字符串，甚至在 API 将其发送回来之前，在键的值前后添加单引号。

我尚未尝试在 API 中将字典转换为字符串的方法。 调用后，您可以使用类似 JSON.parse(string) 的方法将字符串解析回对象，这可能是最好的选择。

- M G