knockout.js - knockout.js 选项绑定不反映添加的项目

Question

该页面正确显示了顾问的原始列表。但是，当我尝试使用 push() 方法插入数组时，列表大小会更新，但页面上的选择选项列表不会更新。我需要告诉淘汰赛更新吗？这是一些示例代码：

function updateStudentAdviserList(student) {
    var list = viewModel.studentAdvisers();    
    if (student.IsStudentAdviser() == "true" || student.IsStudentAdviser() == true) {
        var alreadyInList = false;
        for (var i = 0; i < list.length; i++) {
            alert(list[i].Id);
            if (list[i].Id == student.Id()) {
                return;
            }
        }

        list.push(student);
        alert('new size: ' + list.length);
    } else {
        for (var i = 0; i < list.length; i++) {
            alert(list[i].Id);
            if (list[i].Id == student.Id()) {
                list.splice(i, 1);
                alert('new size: ' + list.length);
                break;
            }
        }
    }
}

function ViewModel(data) {
    var self = this;    
    this.studentAdvisers = ko.observableArray(data);
}

Answer 1

js您对数组进行了更改，而不是observableArray. 您必须通知knockout更改。你可以打电话valueHasMutated给这个。

function updateStudentAdviserList(student) {
    var list = viewModel.studentAdvisers();    
    if (student.IsStudentAdviser() == "true" || student.IsStudentAdviser() == true) {
        var alreadyInList = false;
        for (var i = 0; i < list.length; i++) {
            alert(list[i].Id);
            if (list[i].Id == student.Id()) {
                return;
            }
        }

        list.push(student);
        alert('new size: ' + list.length);
    } else {
        for (var i = 0; i < list.length; i++) {
            alert(list[i].Id);
            if (list[i].Id == student.Id()) {
                list.splice(i, 1);
                alert('new size: ' + list.length);
                break;
            }
        }
    }

    viewModel.studentAdvisers.valueHasMutated();
}

Answer 2

可观察数组具有与常规数组相同的方法，因此如果您使用：

viewModel.studentAdvisers.push(student)

代替：

list.push(student);

与拼接相同，淘汰赛将通知更改。