Material angular - CheckBoxes

los md-checkbox, una directiva angular, se utiliza como un control de casilla de verificación.

Atributos

La siguiente tabla enumera los parámetros y la descripción de los diferentes atributos de md-checkbox.

No Señor	Descripción de parámetros
1	* ng-model Expresión angular asignable a la que enlazar datos.
2	name El nombre de propiedad del formulario bajo el cual se publica el control.
3	ng-true-value El valor al que se debe establecer la expresión cuando se selecciona.
4	ng-false-value El valor al que se debe establecer la expresión cuando no se selecciona.
5	ng-change Expresión angular que se ejecutará cuando la entrada cambie debido a la interacción del usuario con el elemento de entrada.
6	md-no-ink El uso de atributo indica el uso de efectos de tinta ondulada.
7	aria-label Agrega una etiqueta a la casilla de verificación de accesibilidad. Por defecto, el texto de la casilla de verificación. Si no se encuentra ningún texto predeterminado, se registrará una advertencia.

Ejemplo

El siguiente ejemplo muestra el uso de la directiva md-checkbox y también el uso de casillas de verificación angulares.

am_checkboxes.htm

<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>

Resultado

Verifique el resultado.

↰ Previous page