8

我正在尝试从 knockout.js observableArray 对象中提取唯一属性，以填充下拉菜单。作为新的淘汰赛，我真的很挣扎！

我想遍历联系人列表，并使用 observableArray 中每个人对象的唯一值填充下拉菜单。因此，在下面的代码示例中，我希望在下拉菜单中填充“类型”人员列表 - 家人、朋友等。

在谷歌上找了一个类似的函数，但是它不返回任何值，即使我console.log 结果？

//dummy data more rows in actual code...

var people = [
    { name: "Contact 1", address: "1, a street, a town, a city, AB12 3CD", tel: "0123456789", email: "anemail@me.com", type: "family" },
    { name: "Contact 2", address: "1, a street, a town, a city, AB12 3CD", tel: "0123456789", email: "anemail@me.com", type: "friend" }
];


function ContactsViewModel(people) {

    var self = this;
    self.contacts = ko.observableArray(people);

    self.uniqueSelect = ko.dependentObservable(function() {
        return( ko.utils.arrayGetDistinctValues(self.contacts().type).sort());
    }, self);
};

ko.applyBindings(new ContactsViewModel(people));

和 HTML 模板

<p>Show me: <select data-bind="options: ContactsViewModel.uniqueSelect"></select></p>

任何帮助表示赞赏，作为菜鸟我迷路了！谢谢

4

1 回答 1

13

你不能使用这样的结构self.contacts().type。您应该首先获取类型数组，然后调用Distinct函数：

self.uniqueSelect = ko.dependentObservable(function() {
    var types = ko.utils.arrayMap(self.contacts(), function(item){ return item.type})
    return ko.utils.arrayGetDistinctValues(types).sort();
});

这是工作小提琴：http: //jsfiddle.net/VxT5Y/

于 2012-11-13T11:08:58.063 回答