Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | 1x 1x 1x 1x 6x 6x 6x 6x 6x 6x 6x 1x 1x 1x 1x 1x 1x | import { ChangeDetectionStrategy, Component, input, output, forwardRef, signal } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import { MatCheckboxModule } from '@angular/material/checkbox';
@Component({
selector: 'ui-checkbox',
imports: [MatCheckboxModule],
templateUrl: './checkbox.component.html',
styleUrl: './checkbox.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => CheckboxComponent),
multi: true,
},
],
})
export class CheckboxComponent implements ControlValueAccessor {
label = input<string>('');
disabled = input<boolean>(false);
valueChanged = output<boolean>();
protected checked = signal<boolean>(false);
protected isDisabled = signal<boolean>(false);
private onChange: (value: boolean) => void = () => {
/* empty */
};
private onTouched: () => void = () => {
/* empty */
};
writeValue(value: boolean): void {
this.checked.set(value ?? false);
}
registerOnChange(fn: (value: boolean) => void): void {
this.onChange = fn;
}
registerOnTouched(fn: () => void): void {
this.onTouched = fn;
}
setDisabledState(isDisabled: boolean): void {
this.isDisabled.set(isDisabled);
}
protected onCheckboxChange(checked: boolean): void {
this.checked.set(checked);
this.onChange(checked);
this.valueChanged.emit(checked);
}
protected onBlur(): void {
this.onTouched();
}
}
|