私は Knockout を初めて使用し、システムのユーザーと各ユーザーが持つ役割を示すページで使用しようとしています。
データはobservableArray
ユーザーの中にあります。ユーザー オブジェクトには、別の である roles プロパティがありますobservableArray
。この 2 番目の配列には、ID とブール値の「付与された」プロパティを持つ各ロールのオブジェクトが含まれています。
特定の役割を持つすべてのユーザーを表示できるようにしたいので、役割ごとにチェックボックスがあります。これらのいずれかがチェックされると、リストにはその役割を持つユーザーが表示されます。
私が抱えている問題は、1,000 人ほどのユーザーをロールでフィルタリングするのに数秒かかることです。名前のテキストによるフィルタリングは非常に高速 (数ミリ秒) ですが、役割によるフィルタリングはそうではありません。タイミングコードをいくつか入れました。問題は、ユーザーが選択したロールを持っているかどうかを確認するために使用している方法であるため、ノックアウトを使用するなど、より良い方法があるかどうか疑問に思っていますマジック。
以下は、フィルタリングを行うために使用しているビュー モデルの ko.computed です。結果表は、この関数にバインドされています。
self.filteredUsers = ko.computed(function () {
var textFilter = self.filter(); // this is an observable bound to a text field
var checkedRoles = self.selectedRoles(); // this is a computed, which returns an array of checked roles
return ko.utils.arrayFilter(self.users(), function (user) {
var match = true;
if (user.displayName.toLowerCase().indexOf(textFilter.toLowerCase()) == -1) {
match = false;
}
// for each ticked role, check the user has the role
for (var i = 0; i < checkedRoles.length; i++) {
var roleMatch = false;
for (var j = 0; j < user.roles().length; j++) {
if (user.roles()[j].roleId === checkedRoles[i].roleId && user.roles()[j].granted()) {
roleMatch = true;
break;
}
}
if (!roleMatch) {
match = false;
}
}
return match;
});
});