我对Knockoutjs相对较新，并尝试实施一些高级过滤。我正在寻找使用一系列复选框使用多个类别过滤我的viewmodel数据。
我已经遵循了许多解决方案，这些解决方案允许一次根据一个标准/类别进行过滤。但是，我无法使高级过滤工作。当我根据嵌套数组中的值进行过滤时会出现问题。例如education.course。似乎工作正常，其中所选课程对应于其教育数组中只有一个课程的对象。但是当de /选择与其教育数组中的多个课程匹配的课程时，vm＆＃34;中断＆＃34; /停止工作和控制台日志＆＃34; Uncaught TypeError：无法调用方法＆＃39;课程＆ ＃39;未定义＆＃34;。 Haven已经能够解决这个错误。
我已在此 fiddle 中设置了一些示例数据/和我当前版本的视图模型。 另请参阅下面的当前视图模型。
对此有任何帮助表示感谢。
感谢。
function vm(data) {
var vm = this;
vm.people = ko.observableArray();
ko.mapping.fromJS(data, {}, vm.people);
vm.selectedCourses = ko.observableArray();
vm.selectedSchools = ko.observableArray();
vm.selectedLocations = ko.observableArray();
vm.filtered = ko.computed(function () {
var result;
var self = this;
result = $.grep(self.people(), function (person, i) {
var remove = false;
if (self.selectedLocations().length > 0) {
if (person {
remove = remove || self.selectedLocations().indexOf(person.statename()) === -1
} else {
remove = true
}
}
if (self.selectedCourses().length > 0 || self.selectedSchools().length>0) {
if (person) {
var edResult;
var m1, mCourse, mSchool;
var position = 0;
var mCoursep = [];
var mSchoolp = [];
edResult = $.grep(person.education(), function (education, i) {
if (education) {
mCourse = self.selectedCourses().indexOf(education.course());
mSchool = self.selectedSchools().indexOf(education.name());
if (mCourse > -1) {
m1 = true;
mCoursep[position] = i;
}
if (mSchool > -1) {
m1 = true;
mSchoolp[position]=i;
}
position++;
}
return m1 === true
});
if (edResult.length > 0) {
for (i = 0; i < mCoursep.length; i++) {
remove = remove || self.selectedCourses().indexOf(person.education()[mCoursep[i]].course()) === -1;
}
for(i=0;i<mSchoolp.length;i++){ remove=remove||self.selectedSchools().indexOf(person.education()[mSchoolp[i]].name())===-1;
}
} else {
remove = true
}
}
}
return !remove
});
return result
}, vm);
};
vm.uniqueFilters = ko.computed(function () {
var uniqueCourses = ["Arabic Studies", "Chinese", "English and International Studies", "European and Nigerian Languages", "French", "History and Diplomacy Studies", "International Relations and Strategic Studies", "Kiswahili", "Language and Linguistics", "Languages Arts & Yoruba", "Management Technology", "Medical Laboratory and Technology", "Modern European Languages", "Russian with French/German"];
var uniqueSchools = ["ABTI", "Abia State University Uturu", "Abubakar Tafawa Balewa University Bauchi", "Achievers University Owo Ondo State", "Ambrose Alli University Ekpoma", "Babcock University Ilishan-Remo", "Bells University of Technology Ota", "Bingham University New Karu", "Delta State University Abraka", "Federal University of Technology Akure", "Modibbo Adama University of Technology Yola", "Rivers State University of Science and Technology Port Harcourt"];
var uniqueLocations = ["Abia", "Bauchi", "Cross River", "Delta", "Lagos", "Plateau", "Rivers"]
return {
uniqueCourses: uniqueCourses.sort(),
uniqueSchools: uniqueSchools.sort(),
uniqueLocations: uniqueLocations.sort()
};
});
var sampleData = [{
"firstname": "Ngozi",
"lastname": "Osadebe",
"statename": "Abia",
"ratename": "Declined",
"education": [{
"course": "French",
"name": "Delta State University Abraka",
"awards": "BSc.",
"gpa": "3.2"
}, {
"course": "History and Diplomacy Studies",
"name": "Ambrose Alli University Ekpoma",
"awards": "MSc.",
"gpa": "3.1",
"statename": "Abia"
}]
}, {
"firstname": "Chinedu",
"lastname": "Okorie",
"statename": "Lagos",
"ratename": "Not Rated",
"education": [{
"course": "European and Nigerian Languages",
"name": "Modibbo Adama University of Technology Yola",
"awards": "MSc.",
"gpa": "3.2"
}, {
"course": "Kiswahili",
"name": "Ambrose Alli University Ekpoma",
"awards": "BSc.",
"gpa": "4.6"
}]
}, {
"firstname": "Joachim",
"lastname": "Okeke",
"statename": "Lagos",
"ratename": "Not Rated",
"education": [{
"course": "Languages Arts & Yoruba",
"name": "Federal University of Technology Akure",
"awards": "BSc.",
"gpa": "2.8"
}]
}, {
"firstname": "Chantelle",
"lastname": "Tom",
"statename": "Plateau",
"ratename": "Not Rated",
"education": [{
"course": "Russian with French\/German",
"name": "Bingham University New Karu",
"awards": "MSc.",
"gpa": "3.4"
}, {
"course": "International Relations and Strategic Studies",
"name": "Bells University of Technology Ota",
"awards": "BSc.",
"gpa": "4.4"
}]
}, {
"firstname": "Simisola",
"lastname": "Lawson",
"statename": "Abia",
"ratename": "Not Rated",
"education": [{
"course": "Language and Linguistics",
"name": "Abia State University Uturu",
"awards": "BSc.",
"gpa": "3.1"
}]
}, {
"firstname": "Chuba",
"lastname": "Okadigbo",
"statename": "Bauchi",
"ratename": "Not Rated",
"education": [{
"course": "Chinese",
"name": "Abubakar Tafawa Balewa University Bauchi",
"awards": "BSc.",
"gpa": "4.2"
}, {
"course": "English and International Studies",
"name": "Achievers University Owo Ondo State",
"awards": "MSc.",
"gpa": "3.3"
}]
}]
var initialData = JSON.parse(sampleData);
ko.applyBindings(new vm(initialData));