New Version of vadacl Released as an NPM Package

Angular , vadacl No Comments »

It's been a LONG time since my last blog post.  Work and life simply kept me from doing a lot of personal coding.  But I'm making an effort to get back into the swing of things, and I decided to start my comeback by moving forward with my vadacl Angular validation library.

For anyone not familiar with what vadacl is about, here's the current synopsis:

vadacl is a library that extends and enhances reactive form validation in Angular 4.x. It provides:

  • A mechanism for declaring validation logic within domain classes / data objects that can be reused in multiple components.
  • The ability to configure the text of validation failure messages as part of the domain class validation logic or within a global validation message object.
  • Helper methods for triggering validation and displaying validation results.
  • Additional validation methods beyond those provided by Angular 4.x, and the ability to extend the vadacl validation methods with custom methods in your project.
  • The new version of vadacl (currently version 1.0.10) is available as an NPM package at:

    There is also a separate GitHub repo containing an Angular CLI-powered Angular 4.x app that demonstrates the use of vadacl in different scenarios:

    As part of the transition to an NPM package, vadacl was refactored to allow you to extend or override the validation methods and messages without touching the library files themselves, using files specific to your project.  That will let you update to future versions of vadacl via npm without losing any of your custom code.  The new version was written for Angular 4.x and includes vadacl versions of the newest methods in Angular's Validators class:  min, max, and email.

    The new demonstration application is an updated version of the one still hosted on the old vadacl GitHub repo, and contains not only examples of the new validation methods, but also provides documentation about how to go about extending vadacl and an example of how you can swap out the global messages file with a different one (designed for a different audience or different language) during your build/deployment process.

    Version 0.2.0 of vadacl Released

    Angular 2 , vadacl 1 Comment »

    I just released a new version of my vadacl validation library for Angular 2. The new release includes the following updates:

    • To match a recent change to the pattern Validator in Angular 2, vadacl's pattern validation method was updated to accept both string and RegExp pattern arguments.

    • A requiredTrue validation method was added to parallel the recently-added Angular requiredTrue Validator (used primarily for validating that a checkbox has been checked/set to true).

    • The applyCollectionRule() method was added to the Vadacl class. The new method is designed to be used instead of the applyRules() method when applying a single validation method to a FormGroup or FormArray.

    • Added three new validation methods specifically for FormGroup and FormArray validation:

      • totals: validates that the sum of the numeric values of the FormGroup or FormArray controls equals a certain amount.

      • equalValues: validates that all of the values of the FormControls within a FormGroup or FormArray are exactly equal. Useful for performing password confirmation.

      • withinTrueCount: validates that the number of FormControls within a FormGroup or FormArray with a value of Boolean true falls within a given range. Designed primarily to validate how many checkboxes are checked.

    • Added and updated demos to demonstrate the new validation methods.

    • Updated the demo codebase to Angular 2.4.1

    Locale-Based Message Support Added to vadacl

    Angular 2 , vadacl No Comments »

    The latest release of my vadacl validation library for Angular 2 introduces a new feature:  locale-based error message configuration.


    Learning Angular 2: Implementing My vadacl Validation Library

    Angular 2 , Angular 2 Learning No Comments »

    Version 0.0.7 of my sandbox GuildRunner Angular 2 application is a refactor of the sandbox Chapter form I created in the previous version.  I refactored the form, which uses Angular's reactive form classes (FormControl, FormGroup, FormArray, and FormBuilder) to use a small validation library I created called vadacl.

    The two main features of vadacl are:

    • It allows developers to set validation rules for the properties of a domain class at both the domain class level and the component level (because some validations are there to ensure the data can be persisted back to the server, and those validations should be set on the domain class so they are consistent throughout the application).

    • It gives developers the ability to set a "message" value that will be part of the metadata object returned from a validator when the data is invalid (which you can see in action in the refactored sandbox Chapter form).

    You can read more about vadacl in my blog post about the library and in the README file in the vadacl GitHub repo.

    vadacl: A Library For Streamlining Form Validation in Angular 2

    Angular 2 , vadacl 3 Comments »

    The initial version of my TypeScript-based vadacl library for performing form validation in Angular 2 is now available on GitHub.

    vadacl provides the following enhancements to the typical implementation of form validation via the reactive form classes (FormControl, FormGroup, FormArray, and FormBuilder):

    • Instead of configuring all of the validation in the component hosting the form, you can configure certain validations within the data object itself (validation rules that should remain consistent wherever the data object is used in your application), then add to or modify those validation rules in the component to create the final set of validations needed for a given form.

    • The vadacl validation methods add a "message" property to the metadata object returned when the form data fails validation.  This "message" property value is the message meant to be presented to the user, and can be configured and/or overridden at multiple levels:

      • The method level, via a set of default message values
      • The data object
      • The component level


    • The Vadacl class, whether used as a superclass for your component or as a service, provides methods for providing an array of validator methods to the FormControls in your form and for displaying the validation error "message" values in your template, removing the need to add multiple DOM elements with "ngIf" directives to display each kind of validation error or to add code to your component to gather and translate validation failures into error messages.

    vadacl is (currently) a small library contained in a single folder you can just drop into your Angular application. The GitHub repo contains that folder as part of a small Angular 2.1.1 application containing several working demos of vadacl in action.