【问题标题】:How to remove the initial value of viewmodel while using knockoutjs mapping plugin?如何在使用 knockoutjs 映射插件时删除 viewmodel 的初始值?
【发布时间】:2014-05-27 09:39:48
【问题描述】:

我正在使用 knockoutjs 映射插件。 我正在使用插件将数据绑定到视图模型。 然后我修改数据并提交回来。 提交时,我得到了视图模型的初始值和更改后的值。

小提琴在这里:http://jsfiddle.net/jarajesh/HV7g4/3/

   // Here's my data model
var ViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, {}, self);

    self.nameLength = ko.computed(function() {
      return self.firstName().length;
    }, self);
    self.finalstring = ko.observable('');
    self.numberOfClicks = ko.observable(0);
       self.incrementClickCounter = function() {
           var previousCount = self.numberOfClicks();
            self.numberOfClicks(previousCount + 1);
        };

       self.refresh = function() {
           var newData = {'firstName': 'refreshed', 'lastName': 'person'};
           ko.applyBindings(new ViewModel(newData));
        };

    self.save = function () {
        alert(ko.mapping.toJSON(self));
        //$.ajax({
          //  url: "Knockout2/Save",
            //type: "post",
            //contentType: "application/json",
            //data: ko.mapping.toJSON(self),
            //success: function (response) {
              //  alert(response.Status);
            //}
        //});
        //self.finalstring=ko.mapping.toJSON(self);
    };
};

var newData = {'firstName': 'first', 'lastName': 'person'};
ko.applyBindings(new ViewModel(newData));

重现步骤:

  1. 在jsfidle中点击运行
  2. 在生成的结果页面点击刷新
  3. 点击保存会抛出 4 条警报消息,其中一条包含
  4. 提供的初始值和一个带有修改后的值和一些对象:-)

我认为这与文档中提供的_destroy 有关。

所需的解决方案:

  1. 如何防止提交初始值?
  2. 警报中抛出的对象是什么?
  3. 如何将计算的属性 nameLength 包含到提交中?

【问题讨论】:

    标签: knockout.js knockout-mapping-plugin


    【解决方案1】:

    发布问题不到 5 分钟,我自己就得到了答案

    所需的解决方案:

    1. 如何防止提交初始值? 我再次应用数据,这使得这发生了。已将代码修改为

      ko.mapping.fromJS(newData, {}, self);
      
    2. 警报中抛出的对象是什么?

      在代码中包含未定义的对象数据。修改代码为

      alert(ko.mapping.toJSON(self, mapping));
      
    3. 如何在提交中包含计算的属性 nameLength?

      var mapping = { 'include': ["nameLength"]};
      

    更新的小提琴可以在here找到

    【讨论】:

      猜你喜欢
      • 2012-07-31
      • 2015-08-25
      • 2013-03-03
      • 2012-03-06
      • 2015-03-29
      • 2012-11-01
      • 2012-08-12
      • 2015-07-04
      • 2012-06-22
      相关资源
      最近更新 更多