As I work on developing a model-driven form in Angular2 RC5, one of the features I am implementing is the ability for users to add multiple entries either manually or by importing from a file. To display the imported data in a table, I utilize JavaScript to parse the file contents. For form validation, I have created a custom validator inspired by the built-in ones available here. Here's how I've integrated this into my project:
import {AbstractControl, ValidatorFn} from "@angular/forms";
export class StringValidators {
static isEmail(options: Object): ValidatorFn {
return (control: AbstractControl): {[key: string]: any} => {
var val: string = control.value;
// ... cut ...
var regEx = new RegExp(`^${exp}$`);
return regEx.test(val) ? null : {"isEmail": true};
};
}
}
To apply the validator to a FormControl, I use the following syntax:
userEmail = new FormControl("", [StringValidators.isEmail]);
While this approach works well for single input fields, I'm facing a scenario where multiple user entries need to be validated when imported from a file. I am unsure about how the validation process interacts within the FormControl class. One consideration I have is refactoring my validation logic into a separate class and creating a wrapper around it for Angular to enhance reusability.
Is this method the most effective way to achieve my goal, or am I perhaps overcomplicating the solution?