NgxErrorMessage

NgxErrorMessage is an Angular library that automatically displays form validation error messages for reactive, template-driven, and Signal Forms, with optional @ngx-translate support.

Features

• ✅ Automatic error display — add one directive to an input and get its error message for free
• ✅ Reactive, template-driven, and Signal Forms — same directive works for all three
• ✅ Signal-based — reactive by construction, zoneless-compatible
• ✅ Accessible by default — aria-invalid and aria-describedby are wired onto the host input automatically, no configuration needed
• ✅ Internationalization — optional integration with @ngx-translate/core via a secondary entry point, so it's not a hard dependency
• ✅ Customizable styling — override the CSS classes used for the error container and message
• ✅ Conditional display — control exactly when an error should be shown (touched, dirty, invalid, ...)
• ✅ Configurable error priority — decide which error wins when a control fails more than one validator at once
• ✅ Built-in and custom patterns — a set of ready-to-use regex patterns, plus support for your own
• ✅ Standalone-first — provideNgxErrorMessage() for standalone apps; NgxErrorMessageModule for NgModule apps (deprecated)

Live Example

You can see the library in action here: ngx-error-message-example.

How It Works

Add the ngxErrorMessage directive to a form control. When the control becomes invalid (and matches the configured display condition), the directive renders the message for its first active error, resolved either from a static configuration object or from your @ngx-translate translation files.

<input formControlName="email" ngxErrorMessage />
    └─▶ control becomes invalid + touched
         └─▶ NgxErrorMessage reads control.errors
              └─▶ resolves the message for the first error key
                   └─▶ renders it next to the input

Compatibility

Latest version available for each version of Angular:

ngx-error-message	Angular
4.0.0	20.x to 22.x
3.1.0	16.x to 19.x
3.0.1	16.x to 19.x
3.0.0	16.x to 19.x
2.2.1	10.x to 14.x
2.2.0	10.x to 14.x
2.1.0	9.x to 13.x
2.0.1	8.x to 11.x
2.0.0	8.x to 11.x
1.3.0	9.x 8.x 7.x