利用Knockout+typescript双向绑定实现多ckeckbox选择

有时候多ckeckbox有点烦。多个T/F值搞的人蛋疼。所以换个思路。直接存值！

首先在你的Model中添加observable属用来存取值

let POCOValue:koobservable<string>=ko.observable<string>(null);

然后在ViewModel或者Model中添加一个Computed observable.(推荐在ViewModel中)因为仅仅是对POCO的加工和处理。

public SelectedConditions = ko.computed({
            read: function () {
                var me = this;
                if (me.POCOValue() == "" || me.POCOValue() == null)
                    return [];
                else
                    return me.POCOValue().split(", ");


            },
            write: function (value) {
                var me = this;
                me.POCOValue(value.join(", "));
            },
            owner: this
        });

接着把你要绑定的值全部放到一个数组中。

private myUSStates: any[] = [{ value: 'AL', name: 'Alabama' }, { value: 'AK', name: 'Alaska' }}

最后一步就是在前台把checkbox和这个computed绑定在一起。

<div data-bind="foreach:myUSStates">

        <p> <span data-bind="text: $data.value"></span>
            <input type="checkbox" data-bind="checked:$root.myModel.SelectedConditions,value:$data.name" />//注意。这里要用ROOT跳出当前Context
        </p>
    </div>

OK.完成。不再是单一的用T/F来确定多Checkbox的选择。而是用一个字符串来搞定。

问题：

字符串不能太长。CHROM ，IE，FireFox浏览器会崩。