Knockout observableArray数据绑定未更新

时间:2014-05-15 14:00:42

标签: knockout.js

我有一个非常简单的模型设置,其中我有一个存储在observableArray中的电子邮件地址列表。这些可以通过foreach数据绑定进行编辑,但绑定似乎只是一种方式。当我更改文本框中的值时,更改不会反映在模型中。但是,如果我更新数组之外的另一个字段,则该更新将触发foreach绑定更新。

我有一个小提琴在这里展示:

http://jsfiddle.net/xeLcy/1/

相关的html就在这里

<div data-bind="foreach: addresses">
  <input type="text" data-bind="value: $rawData.address, valueUpdate: 'input'" />
  <button data-bind="click: $parent.removeAddress">Remove</button>
  <br/>
</div>

模型在哪里

var Model = function() {
  var self = this;
  self.modelName = ko.observable("modelName");
  self.maxCount = 4;
  self.addresses = ko.observableArray();

  self.addUser = function(email) {
    self.addresses.push({address: email});
  };

  self.removeAddress = function(email) {
     self.addresses.remove(email);
  };

  self.hasEmpty = ko.computed(function() {
      var hasBlank = false;
      ko.utils.arrayForEach(self.addresses(), function(item){     
         if (item.address === ""){
           hasBlank = true;
           return;
         }
      });
      return hasBlank;
  });

  self.allowAddMore = ko.computed(function() {
    return self.hasEmpty() === false && self.addresses.length <= self.maxCount;
  });

  self.addNew = function() {
    if (!self.hasEmpty()){
      self.addresses.push({address: ''});
    }
  };
};

1 个答案:

答案 0 :(得分:3)

您的地址不是可观察的。将您的addUser更改为:

self.addUser = function(email) {
    self.addresses.push({address: ko.observable(email)});
};

请参阅更新的小提琴:http://jsfiddle.net/nyothecat/xeLcy/2/