core/dynamic-forms/checkbox/checkbox.type.component.ts
FieldType
| changeDetection | ChangeDetectionStrategy.OnPush |
| selector | c8y-field-checkbox |
| templateUrl | ./checkbox.type.component.html |
Properties |
| defaultOptions |
Type : object
|
Default value : {
templateOptions: {
indeterminate: true,
formCheck: 'custom' // 'custom' | 'custom-inline' | 'custom-switch' | 'stacked' | 'inline' | 'nolabel'
}
}
|
<div class="d-flex">
<label
[class.c8y-checkbox]="!to.switchMode"
[class.c8y-switch]="to.switchMode"
[class.has-error]="showError"
>
<input
[class.is-invalid]="showError"
[class.form-check-input]="to.formCheck.indexOf('custom') === -1"
[class.position-static]="to.formCheck === 'nolabel'"
[class.custom-control-input]="to.formCheck.indexOf('custom') === 0"
type="checkbox"
[indeterminate]="to.indeterminate && formControl.value == null"
[formControl]="formControl"
[formlyAttributes]="field"
[attr.data-cy]="'c8y-field-checkbox--' + (field.templateOptions?.optionDataCy || to.label)"
/>
<span></span>
<i
*ngIf="to.icon"
c8yIcon="{{to.icon}}"
class="icon-flex icon-20 m-r-4"
></i>
<span
class="text-truncate"
title="{{ to.label | humanize }}"
>
{{ to.label | humanize }}
</span>
<span *ngIf="to.required && to.hideRequiredMarker !== true">
<em
class="m-l-4"
translate
>
(required)
</em>
</span>
</label>
<button
class="btn-help btn-help--sm m-t-auto m-b-auto"
[attr.aria-label]="'Help' | translate"
[popover]="to.description"
placement="right"
triggers="focus"
type="button"
*ngIf="!!to.description"
></button>
</div>