想从KoObservableArray删除重复值。 我有以下的JS文件。 我想在UI为下拉菜单的名字列绑定以及删除重复值。
建议做同样的最好方式。
JS文件
$(function () {
var initialData = [
{ name: "Well-Travelled Kitten", sales: 352, price: 75.95 },
{ name: "Speedy Coyote", sales: 89, price: 190.00 },
{ name: "Furious Lizard", sales: 152, price: 25.00 },
{ name: "Furious Lizard", sales: 213, price: 25.00 },
{ name: "Indifferent Monkey", sales: 1, price: 99.95 },
{ name: "Speedy Coyote", sales: 89, price: 190.00 },
{ name: "Brooding Dragon", sales: 0, price: 6350 },
{ name: "Ingenious Tadpole", sales: 39450, price: 0.35 },
{ name: "Optimistic Snail", sales: 420, price: 1.50 }
];
var PagedGridModel = function (items) {
this.items = ko.observableArray(items);
};
ko.applyBindings(new PagedGridModel(initialData));
});
HTML File
<body>
<nav>
<label for="name">Name</label>
<select id="name" data-bind="options: items, optionsText: 'name', optionsCaption:'All'">
</select>
</nav>
</body>
上面给我的下拉重名。
见下文对你怎么能有一个计算观察到的返回一个数组的样本。 我刚才写下来用于滤波的逻辑，但它可能是不正确的或最佳，我将它留给你来改善它。
$(function () {
var initialData = [
{ name: "Well-Travelled Kitten", sales: 352, price: 75.95 },
{ name: "Speedy Coyote", sales: 89, price: 190.00 },
{ name: "Furious Lizard", sales: 152, price: 25.00 },
{ name: "Furious Lizard", sales: 213, price: 25.00 },
{ name: "Indifferent Monkey", sales: 1, price: 99.95 },
{ name: "Speedy Coyote", sales: 89, price: 190.00 },
{ name: "Brooding Dragon", sales: 0, price: 6350 },
{ name: "Ingenious Tadpole", sales: 39450, price: 0.35 },
{ name: "Optimistic Snail", sales: 420, price: 1.50 }
];
var PagedGridModel = function (items) {
var self = this;
self.items = ko.observableArray(items);
self.uniqueItems = ko.computed({
var filteredArray = [];
var i;
$.each(self.items(), function (index, item) {
bool alreadyAdded = false;
for (i in filteredArray) {
if (filteredArray[i].name == item.name) {
alreadyAdded = true;
}
}
if (!alreadyAdded) {
filteredArray.push(item);
}
});
return filteredArray;
});
};
ko.applyBindings(new PagedGridModel(initialData));
});
终于在你的HTML
<select id="name" data-bind="options: uniqueItems, optionsText: 'name', optionsCaption:'All'">
</select>
