NOTE Still in development
A List Of validators for Angular 2 Forms based on validator.js
$ npm install --save angular2-validators
import { Component } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { isEmail } from 'angular2-validators';
@Component({
selector: 'app-root',
template: `
<form [formGroup]="theForm" novalidate>
<label for="name">Name</label>
<input type="text" class="form-control" formControlName="name">
</form>
`,
})
export class AppComponent {
theForm: FormGroup;
constructor(private fb: FormBuilder) {
this.theForm = fb.group({
name: ['', [Validators.required, isEmail]]
});
}
}
We need to import angular2-validators as a module in app.module.ts file, or equivalent
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { Ng2ValidatorsModule } from 'angular2-validators';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule,
HttpModule,
Ng2ValidatorsModule // Add angular2-validators module here
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Then you can just use it in your template as a directive
<input type="text" class="form-control" formControlName="name" isEmail>
This module is still in development and PRs are so welcome to the develop branch