Knockoutjs-disable-binding

提供:Dev Guides
移動先:案内検索

KnockoutJS-バインドを無効にする

このバインディングは、イネーブルバインディングの否定です。 このバインディングは、パラメーターがtrueと評価されたときに、関連付けられたDOM要素を無効にします。

構文

disable: <binding-value>

パラメーター

  • パラメータは、ブール値のような値で構成され、要素を無効にするかどうかを決定します。 パラメーターがtrueまたはtrueのような値の場合、要素は無効になります。
  • 非ブール値は、緩やかなブール値と見なされます。 意味0およびnullはfalseのような値と見なされ、整数および非nullオブジェクトはtrueのような値と見なされます。
  • パラメーターの条件に観測可能な値が含まれている場合、観測可能な値が変更されるたびに条件が再評価されます。 同様に、関連するマークアップは、条件の結果に基づいて無効になります。

バインドの無効化の使用方法を示す次の例を見てみましょう。

<!DOCTYPE html>
   <head>
      <title>KnockoutJS Disable Binding</title>
      <script src = "https://ajax.aspnetcdn.com/ajax/knockout/knockout-3.3.0.js"
         type = "text/javascript"></script>
   </head>

   <body>
      <p> Enter your feedback here:<br><br>
         <textarea rows = 5 data-bind = "value: hasFeedback,
            valueUpdate: 'afterkeydown'" ></textarea>
      </p>

      <p><button data-bind = "disable: !(hasFeedback())">Save Feedback</button></p>

      <script type = "text/javascript">
         function ViewModel () {
            hasFeedback = ko.observable('');
         };

         var vm = new ViewModel();
         ko.applyBindings(vm);
      </script>

   </body>
</html>

出力

上記のコードがどのように機能するかを確認するために、次の手順を実行してみましょう-

  • 上記のコードを disable-bind ファイルに保存します。
  • このHTMLファイルをブラウザーで開きます。
  • ユーザーがフィードバックを入力していない場合、保存ボタンは無効になります。

ランダム式を使用して、要素を無効にするかどうかを決定することもできます。