[ Web Proxy ]
URL:
Viewing: https://angular.dev/api/forms/NgControl [Back]  [Original]
NgControl Angular Skip to main content
menu
close
more_horiz
menuAPI
@angular/forms

NgControl

Class
stable

A base class that all FormControl-based directives extend. It binds a FormControl object to a DOM element.

On this page

    arrow_upward_alt Back to the top

    API

        
      abstract class NgControl extends AbstractControlDirective {  constructor(injector?: Injector | undefined, renderer?: Renderer2 | undefined, rawValueAccessors?: ControlValueAccessor[] | undefined);  name: string | number | null;  valueAccessor: ControlValueAccessor | null;  protected isCustomControlBased: boolean;  protected readonly selectedValueAccessor: ControlValueAccessor | null;  abstract viewToModelUpdate(newValue: any): void;  protected parseErrorsValidator: ValidatorFn | null;  protected customControlBindings: { value?: unknown; disabled?: boolean | undefined; touched?: boolean | undefined; dirty?: boolean | undefined; valid?: boolean | undefined; invalid?: boolean | undefined; pending?: boolean | undefined; required?: boolean | undefined; errors?: ValidationErrors | null | undefined; } | null;  protected setupCustomControl(): void;  protected ngControlUpdate(host: ControlDirectiveHost<undefined>, bindRequired: boolean): void;  protected readonly shouldBindRequired: boolean;  protected removeParseErrorsValidator(control: AbstractControl<any, any, any> | null | undefined): void;  abstract override readonly control: AbstractControl<any, any, any> | null;  override readonly value: any;  override readonly valid: boolean | null;  override readonly invalid: boolean | null;  override readonly pending: boolean | null;  override readonly disabled: boolean | null;  override readonly enabled: boolean | null;  override readonly errors: ValidationErrors | null;  override readonly pristine: boolean | null;  override readonly dirty: boolean | null;  override readonly touched: boolean | null;  override readonly status: string | null;  override readonly untouched: boolean | null;  override readonly statusChanges: any;  override readonly valueChanges: any;  override readonly path: string[] | null;  override readonly validator: ValidatorFn | null;  override readonly asyncValidator: AsyncValidatorFn | null;  override reset(value?: any): void;  override hasError(errorCode: string, path?: string | (string | number)[] | undefined): boolean;  override getError(errorCode: string, path?: string | (string | number)[] | undefined): any;}

    constructor

    NgControl
    @paraminjectorInjector | undefined
    @paramrendererRenderer2 | undefined
    @paramrawValueAccessorsControlValueAccessor[] | undefined
    @returnsNgControl

    name

    string | number | null

    The name for the control

    valueAccessor

    ControlValueAccessor | null

    The value accessor for the control

    viewToModelUpdate

    void

    The callback method to update the model from the view when requested

    @paramnewValueany

    The new value for the view

    @returnsvoid

    parseErrorsValidator

    ValidatorFn | null

    Validator function that returns current parse errors.

    customControlBindings

    { value?: unknown; disabled?: boolean | undefined; touched?: boolean | undefined; dirty?: boolean | undefined; valid?: boolean | undefined; invalid?: boolean | undefined; pending?: boolean | undefined; required?: boolean | undefined; errors?: ValidationErrors | null | undefined; } | null

    Tracks last bound values to avoid unnecessary FVC updates.

    setupCustomControl

    void
    @returnsvoid

    ngControlUpdate

    void
    @paramhostControlDirectiveHost<undefined>
    @parambindRequiredboolean
    @returnsvoid

    shouldBindRequired

    boolean

    Whether the control should bind the required property (in custom control mode).

    Can be overridden by subclasses that handle required in a different way.

    removeParseErrorsValidator

    void
    @paramcontrolAbstractControl<any, any, any> | null | undefined
    @returnsvoid

    control

    AbstractControl<any, any, any> | null

    A reference to the underlying control.

    value

    any

    Reports the value of the control if it is present, otherwise null.

    valid

    boolean | null

    Reports whether the control is valid. A control is considered valid if no validation errors exist with the current value. If the control is not present, null is returned.

    invalid

    boolean | null

    Reports whether the control is invalid, meaning that an error exists in the input value. If the control is not present, null is returned.

    pending

    boolean | null

    Reports whether a control is pending, meaning that async validation is occurring and errors are not yet available for the input value. If the control is not present, null is returned.

    disabled

    boolean | null

    Reports whether the control is disabled, meaning that the control is disabled in the UI and is exempt from validation checks and excluded from aggregate values of ancestor controls. If the control is not present, null is returned.

    enabled

    boolean | null

    Reports whether the control is enabled, meaning that the control is included in ancestor calculations of validity or value. If the control is not present, null is returned.

    errors

    ValidationErrors | null

    Reports the control's validation errors. If the control is not present, null is returned.

    pristine

    boolean | null

    Reports whether the control is pristine, meaning that the user has not yet changed the value in the UI. If the control is not present, null is returned.

    dirty

    boolean | null

    Reports whether the control is dirty, meaning that the user has changed the value in the UI. If the control is not present, null is returned.

    touched

    boolean | null

    Reports whether the control is touched, meaning that the user has triggered a blur event on it. If the control is not present, null is returned.

    status

    string | null

    Reports the validation status of the control. Possible values include: 'VALID', 'INVALID', 'DISABLED', and 'PENDING'. If the control is not present, null is returned.

    untouched

    boolean | null

    Reports whether the control is untouched, meaning that the user has not yet triggered a blur event on it. If the control is not present, null is returned.

    statusChanges

    any

    Returns a multicasting observable that emits a validation status whenever it is calculated for the control. If the control is not present, null is returned.

    valueChanges

    any

    Returns a multicasting observable of value changes for the control that emits every time the value of the control changes in the UI or programmatically. If the control is not present, null is returned.

    path

    string[] | null

    Returns an array that represents the path from the top-level form to this control. Each index is the string name of the control on that level.

    validator

    ValidatorFn | null

    Synchronous validator function composed of all the synchronous validators registered with this directive.

    asyncValidator

    AsyncValidatorFn | null

    Asynchronous validator function composed of all the asynchronous validators registered with this directive.

    reset

    void

    Resets the control with the provided value if the control is present.

    @paramvalueany
    @returnsvoid

    hasError

    boolean

    Reports whether the control with the given path has the error specified.

    @paramerrorCodestring

    The code of the error to check

    @parampathstring | (string | number)[] | undefined

    A list of control names that designates how to move from the current control to the control that should be queried for errors.

    @returnsboolean

    whether the given error is present in the control at the given path.

    If the control is not present, false is returned.

    Usage notes

    For example, for the following FormGroup:

    form = new FormGroup({
  address: new FormGroup({ street: new FormControl() })
});

    The path to the 'street' control from the root form would be 'address' -> 'street'.

    It can be provided to this method in one of two formats:

    1. An array of string control names, e.g. ['address', 'street']
    2. A period-delimited list of control names in one string, e.g. 'address.street'

    If no path is given, this method checks for the error on the current control.

    getError

    any

    Reports error data for the control with the given path.

    @paramerrorCodestring

    The code of the error to check

    @parampathstring | (string | number)[] | undefined

    A list of control names that designates how to move from the current control to the control that should be queried for errors.

    @returnsany

    error data for that particular error. If the control or error is not present, null is returned.

    Usage notes

    For example, for the following FormGroup:

    form = new FormGroup({
  address: new FormGroup({ street: new FormControl() })
});

    The path to the 'street' control from the root form would be 'address' -> 'street'.

    It can be provided to this method in one of two formats:

    1. An array of string control names, e.g. ['address', 'street']
    2. A period-delimited list of control names in one string, e.g. 'address.street'
    Jump to details

    Social Media

    Community

    Resources

    Community translations

    Super-powered by Google 2010-2026. Code licensed under an MIT-style License . Documentation licensed under CC BY 4.0 . Built by Angular at v22.2.3+sha-5706791.

    Web Proxy Viewer  |  New URL  |  Original Page