ノックアウトjsに入力タイプのチェックボックスがあり、このチェックボックスがチェックされているときに「真実ではない」アクションを実行したい. このようなもの:
<input type="checkbox" data-bind="checked: !IsVisible"/>
しかし、これは機能していません。IsHidden を呼び出して一般的なチェック済みバインディングを設定できることはわかっていますが、この動作が必要な特殊な状況があります。
ノックアウトjsに入力タイプのチェックボックスがあり、このチェックボックスがチェックされているときに「真実ではない」アクションを実行したい. このようなもの:
<input type="checkbox" data-bind="checked: !IsVisible"/>
しかし、これは機能していません。IsHidden を呼び出して一般的なチェック済みバインディングを設定できることはわかっていますが、この動作が必要な特殊な状況があります。
カスタム バインディングを定義します。あなたが求めているものと非常によく似たセクションがある「KnockoutJSのビューの簡素化とクリーンアップ」を参照してください。基本的に、次のようなものが機能するはずです(注:テストされていません):
ko.bindingHandlers.notChecked = {
update: function(element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
ko.bindingHandlers.checked.update(element, function() { return!value; });
}
};
次に、次のことができます。
data-bind="notChecked: IsVisible"
バインディングでオブザーバブルを直接評価することができ、あなたのアイデアはうまくいくはずです。
このような: <input type="checkbox" data-bind="checked: !IsVisible()"/>
ただし、これは「可観測性」を失うことに注意してください。これはおそらくあなたが望むものではありません。
IsHidden
別の方法は、IsVisible から計算されるプロパティを作成することです。
var ViewModel = function (model) {
var self = this;
self.IsVisible = ko.observable(model.IsVisible);
self.IsHidden = ko.computed({
read: function () {
return !self.IsVisible();
},
write: function (newValue) {
self.IsVisible(!newValue);
}
});
}
とあるからです!オブザーバブルに対して関数を実行しています。これを使って:
<input type="checkbox" data-bind="checked: !IsVisible()"/>