Angular 2 custom validator with parameters
Here is a sample. It's a min value validator where you pass in a number to validate.
import {Control} from 'angular2/common';export const minValueValidator = (min:number) => { return (control:Control) => { var num = +control.value; if(isNaN(num) || num < min){ return { minValue: {valid: false} }; } return null; };};
More details can be found in the Custom Validators official documentation page.
The minValueValidator example basically shows that you can use a factory for your custom validator so it will be something like this:
static minValue = (num: Number) => { return (control:Control) => { var num = control.value; if (isNaN(num) || num < 5 ) { return {"minValue": true}; } return null; }}
In my case I use FormControl not Control
import { FormControl } from '@angular/forms';
Another solution here that uses a little more Angular nuance:
static minValue(min: number): ValidatorFn { return (control: AbstractControl): ValidationErrors | null => { if (control.value == null || control.value == '') { //avoid validation if empty, we are not testing for required here return null; } const errors: ValidationErrors = {}; let num = +control.value; if (isNaN(num) || num < min) { errors.isLessThanMin = { message: `Number must be greater that ${min}` }; } return Object.keys(errors).length ? errors : null; }; }
Now you have a much more reusable html error message
<div *ngIf="control.errors.isLessThanMin>{{control.errors.isLessThanMin.message}}</div>