[解決済み] Knockout JSでラジオボタンにtrue/falseをバインドする。

質問

ビューモデルにIsMaleという値があり、trueまたはfalseの値を持っています。

UIでは、この値を以下のラジオボタンにバインドしたいと思います。

<label>Male
   <input type="radio" name="IsMale" value="true" data-bind="checked:IsMale"/>
</label> 
<label>Female
   <input type="radio" name="IsMale" value="false" data-bind="checked:IsMale"/>
</label>

私が思うに、問題は checked は文字列 "true" / "false" を期待することです。そこで質問なのですが、このUIとモデルで2ウェイバインディングを実現するにはどうしたらいいのでしょうか？

どのように解決するのですか？

ひとつの方法として 書き込み可能な計算された観測値 .

この場合、私は、書き込み可能な計算された観測値を IsMale observableのサブobservableにすることです。 あなたのビューモデルは次のようになります。

var ViewModel = function() {
   this.IsMale = ko.observable(true);

   this.IsMale.ForEditing = ko.computed({
        read: function() {
            return this.IsMale().toString();  
        },
        write: function(newValue) {
             this.IsMale(newValue === "true");
        },
        owner: this        
    });          
};

のようにUIでバインドすることになります。

<label>Male
   <input type="radio" name="IsMale" value="true" data-bind="checked:IsMale.ForEditing"/>
</label> 
<label>Female
   <input type="radio" name="IsMale" value="false" data-bind="checked:IsMale.ForEditing"/>
</label>

サンプルです。 http://jsfiddle.net/rniemeyer/Pjdse/