Checkbox
The FktCheckbox component provides a clean and accessible checkbox input with custom styling. Built with Angular signals and reactive forms, it offers seamless integration with form validation and state management.
Import
import {FktCheckboxComponent} from "frakton-ng/checkbox";Basic checkbox
A basic checkbox with label text. Click either the checkbox or the label to toggle the state.
Pre checked checkbox
A checkbox that is initially checked. The control is initialized with true as the default value.
Disabled state
A checkbox in disabled state. The checkbox cannot be toggled and appears with reduced opacity.
Validation
A checkbox with required validation. The checkbox must be checked for the form to be valid, and shows error state when invalid.
Checkbox Validation Example
@for (error of form.termsAccepted().errors(); track error.kind) {
}
Form is {{ form().valid() ? 'valid' : 'invalid' }}
Terms accepted: {{ form.termsAccepted().value() ? 'Yes' : 'No' }}
Newsletter subscription: {{ form.newsletterSubscription().value() ? 'Yes' : 'No' }}