角材-チェックボックス

Angular Directiveである md-checkbox は、チェックボックスコントロールとして使用されます。

属性

次の表に、 md-checkbox のさまざまな属性のパラメーターと説明を示します。

Sr.No	Parameter & Description
1	ng-model* データバインド先に割り当て可能な角度式。
2	name コントロールが公開されるフォームのプロパティ名。
3	ng-true-value 選択時に式を設定する値。
4	ng-false-value 選択されていない場合に式を設定する値。
5	ng-change ユーザーが入力要素を操作したために入力が変更されたときに実行される角度式。
6	md-no-ink 属性の使用は、波紋インク効果の使用を示します。
7	aria-label アクセシビリティのチェックボックスにラベルを追加します。デフォルトはチェックボックスのテキストです。デフォルトのテキストが見つからない場合、警告がログに記録されます。

例

次の例は、md-checkboxディレクティブの使用と、角度付きチェックボックスの使用を示しています。

*_am_checkboxes_*

<html lang = "en">
   <head>
      <link rel = "stylesheet"
         href = "https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>

      <script language = "javascript">
         angular
            .module('firstApplication', ['ngMaterial'])
            .controller('checkBoxController', checkBoxController);

         function checkBoxController ($scope) {
         }
      </script>
   </head>

   <body ng-app = "firstApplication">
      <md-checkbox ng-model = "isChecked" aria-label = "Married">
         Married
      </md-checkbox>

      <md-checkbox md-no-ink ng-model = "hasInk" aria-label = "No Ink Effects">
         Single
      </md-checkbox>

      <md-checkbox ng-disabled = "true" ng-model = "isDisabled" aria-label = "Disabled">
         Don't know (Disabled)
      </md-checkbox>
   </body>
</html>

結果

結果を確認します。

Angular-material-checkboxes

角材-チェックボックス

属性

例

結果

目次