ko.applyBinding使用Knockout刷新搜索结果?

时间:2012-10-30 19:00:41

标签: jquery .net asp.net-mvc-3 knockout.js

我想用搜索到的数据更新数据绑定UI-Li列表的内容。我正在使用以下ViewModel

function PatientsModel(data)
{
    var self = this;

    self.Patients = ko.observableArray([]);

    self.Patients(data.Patients);

    self.addPatient = function (model, event)
    {
        alert("Patients to Add: " + model.LastName + ',' + model.FirstName);
        //Replace with AJAX Calls : self.people.push({ name: "New at " + new Date() });
    };

    self.removePatient = function (model, event)
    {
        alert("Patients to Delete:" + model.LastName + ',' + model.FirstName);
        //Replace with AJAX calls : self.people.remove(this);
    }

    self.RefreshData = function (data)
    {
        self.Patients = ko.observableArray([]);
        self.Patients(data.Patients);
    }
}

刷新我创建的内容RefreshData,这个方法将更新患者,这是数据绑定“foreach:患者”与Ul

我正在关注Bind:

AllPatientList.PatientsModel = null;
                            AllPatientList.PatientsModel = new PatientsModel(data);
                            ko.applyBindings(AllPatientList.PatientsModel, $('#AllPatientDiv>div>ul')[0]);

以及更新View Model的内容:

if (AllPatientList.PatientsModel != null && AllPatientList.PatientsModel != undefined)
                            {
                                AllPatientList.PatientsModel.RefreshData(data);
                            }
                            else
                            {
                                AllPatientList.PatientsModel = new PatientsModel(data);
                                ko.applyBindings(AllPatientList.PatientsModel, $('#AllPatientDiv>div>ul')[0]);
                        }

但它不起作用,UL的内容不变

此外,我尝试做以下事项:

ko.cleanNode($('#AllPatientDiv>div>ul')[0]);
AllPatientList.PatientsModel = new PatientsModel(data);
                                ko.applyBindings(AllPatientList.PatientsModel, $('#AllPatientDiv>div>ul')[0]);

它正在生成带有重复/重复dataEntries的列表。它显示了9个列表项而不是3.(每个重复3次)。

我无法弄清楚我在这里做了什么错。 ko.cleanNode()也不会从列表中删除内容。请帮助,如何使用更新的内容重新绑定UL-LI列表。

1 个答案:

答案 0 :(得分:2)

它们没有改变,因为您的RefreshData函数正在破坏绑定。首次调用applyBindings()时,会创建对Patients数组的订阅。当您致电RefreshData时,您使用新的覆盖数组。这个新数组没有绑定订阅。

如果要清除旧数组,请在添加新数据之前使用removeAll。这将使绑定订阅保持不变。

编辑:

这是展示此

very simple fiddle