1

ko.mapping を使用してマッピングされた次の JSON オブジェクトがあるとします。

{ AllowNotifications: ko.observable(true) }

ブール値をラジオ ボタンにバインドして、True の場合は一方のラジオがチェックされ、False の場合はもう一方のラジオがチェックされるようにします。

<input data-bind="checked: AllowNotifications" type="radio" name="allowNotifications" value="true"><label class="small positive" for="objectNotifications_true">Yes</label>
<input data-bind="checked: AllowNotifications" type="radio" name="allowNotifications" value="false"><label class="small negative" for="objectNotifications_false">No</label>

現在、エラーはスローされませんが、これは適切にバインドされません。なぜこれが機能しないのですか?

4

1 に答える 1

3

バインディングが機能しない理由は、ラジオの値「true」または「false」が文字列であり、Knockout がリテラル bool 値にバインドしようとしているためです。

合理的な回避策は、Knockout に bool 値の true と false を文字列表現に変換するように指示することです。そのためには、JSON をオブザーバブルにマップするときにいくつかの指示を提供する必要があります。

例えば:

var jsonData = { AllowNotifications: true };

var mapping = {
    'AllowNotifications': {
        create: function(options) { 
            return options.data ? 'true' : 'false';
        }
    }
};

viewModel = ko.mapping.fromJS(jsonData, mapping);

上記の例では、AllowNotifications フィールドの ko.mapping のオブジェクト作成をカスタマイズしています。

しかし、変換する bool プロパティが複数ある場合、これは冗長で面倒になるため、もう少しエレガントなアプローチを次に示します。

var jsonData = { AllowNotifications: true };

var boolToString = { create: function (options) { return options.data ? 'true' : 'false'; } };

var mapping = {
    'AllowNotifications': boolToString,
    'AnotherBoolProp': boolToString,
    'YetAnotherBoolProp': boolToString
};

var viewModel = ko.mapping.fromJS(jsonData, mapping);

詳細については、KO のドキュメントを参照してください: http://knockoutjs.com/documentation/plugins-mapping.html

于 2013-05-07T21:09:11.080 に答える