import { KbqCheckboxModule } from '@koobiq/components/checkbox';Validator for koobiq checkbox's required attribute in template-driven checkbox. Current CheckboxRequiredValidator only work with `input type=checkbox` and does not work with `kbq-checkbox`.
Selector: kbq-checkbox[required][formControlName], kbq-checkbox[required][formControl], kbq-checkbox[required][ngModel]
| Name | Description |
|---|---|
| required: string | boolean |
A Koobiq checkbox component. Supports all of the functionality of an HTML5 checkbox, and exposes a similar API. A KbqCheckbox 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.
Selector: kbq-checkbox
Exported as: kbqCheckbox| Name | Description |
|---|---|
@Input() big: boolean
|
|
@Input() checked: boolean
|
Whether the checkbox is checked. |
@Input() clickAction: KbqCheckboxClickAction
|
Defines the behavior when a user clicks on the checkbox. |
@Input() disabled: boolean
|
Whether the checkbox is disabled. |
@Input() id: string
|
A unique id for the checkbox input. If none is supplied, it will be auto-generated. |
@Input() 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 checkbox is manually clicked, indeterminate is immediately set to false. |
@Input() labelPosition: "before" | "after"
|
Whether the label should appear after or before the checkbox. Defaults to 'after' |
@Input() name: string
|
Name value will be applied to the input element if present |
@Input() required: boolean
|
Whether the checkbox is required. |
@Input() value: string
|
The value attribute of the native input element |
@Output('change')
change: EventEmitter |
Event emitted when the checkbox's `checked` value changes. |
@Output('indeterminateChange')
indeterminateChange: EventEmitter |
Event emitted when the checkbox's `indeterminate` value changes. |
| color: string | |
| colorClassName: string | current class name of color |
| inputElement: ElementRef |
The native `` element |
| inputId: string | Returns the unique id for the visual hidden input. |
Change event object emitted by KbqCheckbox.
| Name | Description |
|---|---|
| checked: boolean | The new `checked` value of the checkbox. |
| source: KbqCheckbox | The source KbqCheckbox of the event. |
Checkbox click action when user click on input element. noop: Do not toggle checked or indeterminate. check: Only toggle checked status, ignore indeterminate. check-indeterminate: Toggle checked status, set indeterminate to false. Default behavior. undefined: Same as `check-indeterminate`.
type KbqCheckboxClickAction = 'noop' | 'check' | 'check-indeterminate' | undefined;
const KBQ_CHECKBOX_REQUIRED_VALIDATOR: Provider;
Injection token that can be used to specify the checkbox click behavior.
const KBQ_CHECKBOX_CLICK_ACTION: InjectionToken<KbqCheckboxClickAction>;