Knockoutjs-uniquename-binding

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

KnockoutJS-uniqueNameバインディング

このバインディングは、DOM要素の一意の名前を生成するために使用されます。 DOM要素に名前属性がなかった場合、このバインディングはそれを与え、一意の文字列値に設定します。

これを頻繁に使用する必要はありません。 いくつかのまれなケースでのみ役立ちます。たとえば、

  • jQuery Validationは現在、名前を持つ要素のみを検証します。 Knockout UIでこれを使用するには、uniqueNameバインディングを適用してjQuery検証の混乱を避ける必要がある場合があります。
  • IE 6では、名前属性がない場合、ラジオボタンをチェックできません。 KOは、これらの要素でuniqueNameを内部的に使用して、チェックできるようにします。

構文

uniqueName: <binding-value>

パラメーター

ここでのパラメーターは、ブール値trueまたはfalse、またはブール値のような結果になる式になります。 このパラメーターが_true_または_true_-like値に設定されている要素に対して、KOによって一意の名前が生成されます。

uniqueNameバインディングの使用方法を示す次の例を見てみましょう。

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

   <body>
      <p>Enter your pet's name:
         <input data-bind = "value: someValue, uniqueName: true"/>
      </p>

      <p>
         <button data-bind = "click: showMessage">Click here to read message </button>
      </p>

      <script type = "text/javascript">
         function ViewModel() {
            this.someValue = ko.observable();

            this.showMessage = function() {
               alert(" Nice Name"+ "\nSee rendered markup to view unique name generated!!!");
            }
         };

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

   </body>
</html>

出力

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

  • 上記のコードを uniquename-bind ファイルに保存します。
  • このHTMLファイルをブラウザーで開きます。
  • F12を押して、レンダリングされたマークアップを確認します。 一意の名前はKOによって生成されます。