Question

此jsFiddle显示我的目标的错误代码。我希望每次用户选择当天的日期添加/删除到日期列表。使用Knockout 2.1.0。

HTML：

<ul data-bind="foreach: bydayOptions">
    <li>
        <input type="checkbox" name="byday" data-bind="attr: {value: value, checked: $parent.byday().indexOf(value) >= 0}, event: {change: $parent.bydayHandler(value)}">
        <label data-bind="for: value"><b data-bind="text: $data.text"></b></label>
    </li>
</ul>

<b data-bind="text: ko.toJSON(byday())"></b>

JavaScript的：

var viewModel = function(args) {
    var self = this;
    self.byday = ko.observableArray(args.byday);

    self.bydayOptions = [{
        text: "Monday",
        value: "Mon"
    }, {text: "Tuesday",
        value: "Tue"
    }, {text: "Wednesday",
        value: "Wed",
    }, {text: "Thursday",
        value: "Thu"
    }, {text: "Friday",
        value: "Fri"
    }, {text: "Saturday",
        value: "Sat"
    }, {text: "Sunday",
        value: "Sun"
    }];

    self.bydayHandler = function(d){
        console.debug(">>> inside the byday Handler");
        console.log(self.byday());
        if(d !== undefined){
            if(self.byday().indexOf(d) >= 0){
                self.byday().splice(self.byday().indexOf(d), 1);
            } else {
                self.byday().push(d);
            }
        }
    };
};

ko.applyBindings(new viewModel({byday: ["Mon"]}));

Answer 1

淘汰赛checked绑定为您解决了很多问题。不需要事件处理程序。

这是一个更新的小提琴： http://jsfiddle.net/daedalus28/pmMZW/

将ko.observableArray绑定到{value，text}选项列表

1 个答案: