cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(aio): tech edits to form validation

Browse Source 
closes #18495
This commit is contained in:
Kapunahele Wong
2017-08-02 18:01:09 -04:00
committed by Victor Berchet
parent 939dc44391
commit 9b015a95eb
3 changed files with 51 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
aio/content/examples/form-validation/src/app/reactive/hero-form-reactive.component.ts
View File

@ -24,7 +24,7 @@ export class HeroFormReactiveComponent implements OnInit {
'name': new FormControl(this.hero.name, [
Validators.required,
Validators.minLength(4),
forbiddenNameValidator(/bob/i)
forbiddenNameValidator(/bob/i) // <-- Here's how you pass in the custom validator.
]),
'alterEgo': new FormControl(this.hero.alterEgo),
'power': new FormControl(this.hero.power, Validators.required)

17
aio/content/examples/form-validation/src/app/shared/forbidden-name.directive.ts
View File

@ -19,23 +19,12 @@ export function forbiddenNameValidator(nameRe: RegExp): ValidatorFn {
providers: [{provide: NG_VALIDATORS, useExisting: ForbiddenValidatorDirective, multi: true}]
// #enddocregion directive-providers
})
export class ForbiddenValidatorDirective implements Validator, OnChanges {
export class ForbiddenValidatorDirective implements Validator {
@Input() forbiddenName: string;
private valFn = Validators.nullValidator;
ngOnChanges(changes: SimpleChanges): void {
const change = changes['forbiddenName'];
if (change) {
const val: string | RegExp = change.currentValue;
const re = val instanceof RegExp ? val : new RegExp(val, 'i');
this.valFn = forbiddenNameValidator(re);
} else {
this.valFn = Validators.nullValidator;
}
}
validate(control: AbstractControl): {[key: string]: any} {
return this.valFn(control);
return this.forbiddenName ? forbiddenNameValidator(new RegExp(this.forbiddenName, 'i'))(control)
: null;
}
}
// #enddocregion directive