CheckBox: Component gets invalid style, although it is not invalid

Pending Review

Last Updated: 30 Sep 2025 12:43 by Holger

Holger

Created on: 30 Sep 2025 12:43

Category: CheckBox

Type: Bug Report

CheckBox: Component gets invalid style, although it is not invalid

When setting the Checkbox component to disabled while the form is marked as touched, the k-invalid class is applied to the checkbox control.

That's because of the implementation of the isControlInvalid property:

public get isControlInvalid(): boolean {
    return this.control && this.control.touched && !this.control.valid;
}

According to the Angular source code:

    /**
     * A control is `valid` when its `status` is `VALID`.
     *
     * @see {@link AbstractControl.status}
     *
     * @returns True if the control has passed all of its validation tests,
     * false otherwise.
     */
    get valid(): boolean;

So valid() returns false when `status` is DISABLED.

The `isControlInvalid`property should better implemented like this:

public get isControlInvalid(): boolean {
    return this.control && this.control.touched && this.control.invalid;
}

Please check this Stackblitz: https://stackblitz.com/edit/angular-dznoe1xj?file=src%2Fapp%2Fapp.component.ts