Question

想让用户通过列表中的复选框选择人。

此示例有效，但我想知道，如果你这样做的话。

主要问题是，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

谢谢

Answer 1

最简单的解决方案是使用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

希望有所帮助！

当标记复选框时，是否有更优雅的方式通过id获取任意javascript对象？

1 个答案: