Logo for jsDocs.io

@angular2-material/checkbox

  • Version 2.0.0-alpha.8-3
  • Published
  • No dependencies
  • MIT license

Install

npm i @angular2-material/checkbox
yarn add @angular2-material/checkbox
pnpm add @angular2-material/checkbox

Overview

Angular 2 Material checkbox

Index

Variables

Classes

Enums

Variables

variable MD_CHECKBOX_CONTROL_VALUE_ACCESSOR

const MD_CHECKBOX_CONTROL_VALUE_ACCESSOR: any;

  • Provider Expression that allows md-checkbox to register as a ControlValueAccessor. This allows it to support [(ngModel)].

Classes

class MdCheckbox

class MdCheckbox implements ControlValueAccessor {}

  • A material design checkbox component. Supports all of the functionality of an HTML5 checkbox, and exposes a similar API. An MdCheckbox can be either checked, unchecked, indeterminate, or disabled. Note that all additional accessibility attributes are taken care of by the component, so there is no need to provide them yourself. However, if you want to omit a label and still have the checkbox be accessible, you may supply an [aria-label] input. See: https://www.google.com/design/spec/components/selection-controls.html

constructor

constructor(_renderer: Renderer, _elementRef: ElementRef);

    property align

    align: 'start' | 'end';

    • Whether or not the checkbox should come before or after the label.

    property ariaLabel

    ariaLabel: string;

    • Attached to the aria-label attribute of the host element. In most cases, arial-labelledby will take precedence so this may be omitted.

    property ariaLabelledby

    ariaLabelledby: string;

    • Users can specify the aria-labelledby attribute which will be forwarded to the input element

    property change

    change: EventEmitter<MdCheckboxChange>;

    • Event emitted when the checkbox's checked value changes.

    property checked

    checked: boolean;

    • Whether the checkbox is checked. Note that setting checked will immediately set indeterminate to false.

    property disabled

    disabled: boolean;

    • Whether the checkbox is disabled. When the checkbox is disabled it cannot be interacted with. The correct ARIA attributes are applied to denote this to assistive technology.

    property hasFocus

    hasFocus: boolean;

      property id

      id: string;

      • A unique id for the checkbox. If one is not supplied, it is auto-generated.

      property indeterminate

      indeterminate: boolean;

      • Whether the checkbox is indeterminate. This is also known as "mixed" mode and can be used to represent a checkbox with three states, e.g. a checkbox that represents a nested list of checkable items. Note that whenever checked is set, indeterminate is immediately set to false. This differs from the web platform in that indeterminate state on native checkboxes is only remove when the user manually checks the checkbox (rather than setting the checked property programmatically). However, we feel that this behavior is more accommodating to the way consumers would envision using this component.

      property inputId

      readonly inputId: string;

      • ID to be applied to the input element

      property name

      name: string;

      • Name value will be applied to the input element if present

      property onTouched

      onTouched: () => any;

      • Called when the checkbox is blurred. Needed to properly implement ControlValueAccessor.

      property tabindex

      tabindex: number;

      • The tabindex attribute for the checkbox. Note that when the checkbox is disabled, the attribute on the host element will be removed. It will be placed back when the checkbox is re-enabled.

      method registerOnChange

      registerOnChange: (fn: (value: any) => void) => void;

      • Implemented as part of ControlValueAccessor. TODO: internal

      method registerOnTouched

      registerOnTouched: (fn: any) => void;

      • Implemented as part of ControlValueAccessor. TODO: internal

      method toggle

      toggle: () => void;

      • Toggles the checked value between true and false

      method writeValue

      writeValue: (value: any) => void;

      • Implemented as part of ControlValueAccessor. TODO: internal

      class MdCheckboxChange

      class MdCheckboxChange {}

        property checked

        checked: boolean;

          property source

          source: MdCheckbox;

            class MdCheckboxModule

            class MdCheckboxModule {}

              method forRoot

              static forRoot: () => ModuleWithProviders;

                Enums

                enum TransitionCheckState

                enum TransitionCheckState {
                    Init = 0,
                    Checked = 1,
                    Unchecked = 2,
                    Indeterminate = 3,
                }

                • Represents the different states that require custom transitions between them.

                member Checked

                Checked = 1

                • The state representing the component when it's becoming checked.

                member Indeterminate

                Indeterminate = 3

                • The state representing the component when it's becoming indeterminate.

                member Init

                Init = 0

                • The initial state of the component before any user interaction.

                member Unchecked

                Unchecked = 2

                • The state representing the component when it's becoming unchecked.

                Package Files (2)

                Dependencies (0)

                No dependencies.

                Dev Dependencies (0)

                No dev dependencies.

                Peer Dependencies (2)

                Badge

                To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@angular2-material/checkbox.

                • Markdown
                  [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@angular2-material/checkbox)
                • HTML
                  <a href="https://www.jsdocs.io/package/@angular2-material/checkbox"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>