1

不想让用户可以通过列表中的复选框来选择人员。

此示例有效，但我想知道您是否会以相同的方式进行操作。

主要问题是，无法轻松比较 javascript 任意对象。所以必须有一个映射。

这样可以吗？我不想为此创建自定义绑定，我可以在绑定中定义一个 Id 字段。

  function Person(id, name, age) {
    this.id = id;
    this.name = name;
    this.age = age;
  }
  function Party(id, name, persons) {
    var self = this;
    this.id = id;
    this.name = name;
    this.persons = ko.observableArray(persons);
    this.persons_checked = ko.observableArray(); //<--- for the checkboxes
    this.persons_checked.subscribe(function(newValue) {
    var mapped = [];
    mapped = $.map(newValue, function(id) { 
        return $.grep(listOfPeople, function(n) { return n.id == id; });  });
    self.persons(mapped);

});

}

在此处完成示例：http: //jsbin.com/ukipek/6/edit

谢谢

4

1 回答 1

0

最简单的解决方案是使用 knockoutjs 3.x 而不是 2.x，它神奇地完成了！

我已经采取了您的示例并对其进行了修改：

HTML部分：

<h1 data-bind="text: party.name"></h1>
<ul data-bind="foreach: people">
    <li>
        <input type="checkbox" data-bind="checkedValue: $data, checked: $root.party.persons_checked, attr: {value: id}">
        <span data-bind="text:name"></span>
    </li>
</ul>

和 JS 部分：

function Person(id, name, age) {
    var self = this;
    self.id = id;
    self.name = name;
    self.age = age;
}

function Party(id, name, persons) {
    var self = this;
    self.id = id;
    self.name = name;
    self.persons = ko.observableArray(persons);
    self.persons_checked = ko.observableArray();
}

var listOfPeople = [
new Person(1, 'Fred', 25),
new Person(2, 'Joe', 60),
new Person(3, 'Sally', 43)];

var viewModel = function() {
    var self = this;

    this.party = new Party(1, "Weihnachtsfeier1", []);
    this.people = ko.observableArray(listOfPeople);
};

ko.applyBindings(new viewModel());

没有更多的映射，knockoutjs 独自处理一切:-)

如果你愿意，你可以看看这个 jsbin：http: //jsbin.com/sasuvuwabu/1/edit

希望有帮助！

于 2015-03-19T20:31:51.927 回答