敲除js对复杂视图模型的约束限制

时间:2013-12-31 15:59:00

标签: asp.net-mvc knockout.js asp.net-mvc-viewmodel

我学习KnockoutJS已经有3个月了,到目前为止一直很棒。但是,我面临绑定问题。 这是场景:

  1. 我正在使用MVC和KO。
  2. 将MVC模型传递给视图,转换为knockout对象并推入viewModel变量:

    var data = ko.mapping.fromJS(@Html.Raw(Json.Encode(Model))); var viewModel = new HP.ViewModels.CertificationPathViewModel(data); ko.applyBindings(viewModel);

  3. 在viewModel中,我将MVC模型引用为self.data:

    ViewModels.CertificationPathViewModel = (function (data) { var self = ViewModels.BaseEntityViewModel.apply(this, [data]); // some other code return { Data: self.Data, }; }

    ViewModels.BaseEntityViewModel = (function (data) { var self = this; self.data = ko.observable(data); // other code return { Data: self.data, }; }

  4. 在视图中,我像这样进行数据绑定:

    <div id="drpControl" data-bind="CustomDropdown: Data().BusinessUnits.SelectedGroup, optionSettings: { CustomOptions: Data().Units.Groups, CustomOptionsCaption: '-- Select Group --' }"></div>

  5. 我尝试在ajax调用后更新self.data。我返回整个MVC模型对象并尝试替换self.data,如下所示:

    self.data(updatedModel)
    

    我的期望是KO将负责更新,不需要额外的绑定。它适用于简单绑定(例如Value: Data().Something),但它不适用于复杂绑定(例如value: Data().BusinessUnits.SelectedGroup)。

    具有复杂绑定的控件仍然绑定到旧模型,因此KO不知道下次提交ajax请求时要传回的内容。

    这是KO的限制,还是我做得不好?

    由于

1 个答案:

答案 0 :(得分:0)

ko.mapping插件会将self.data上的每个属性更改为一个observable。在更新期间,您需要重新映射更新的数据。

由于您实际上没有发布您的代码,只是未格式化的代码段我无法帮助一大堆,但您应该首先更改此行:self.data(updatedModel)到此:

ko.mapping.fromJS(updatedModel, self.data);

请参阅Knockout.JS mapping documentation

用于堆栈溢出的Protip - 在可能的范围内包含您的完整代码。此外,如果可以,请制作一个jsfiddle来重现您的问题。