From 53f0c2206df6a5f8ee03d611a7563ca1a78cc82d Mon Sep 17 00:00:00 2001 From: Kara Date: Fri, 9 Sep 2016 14:09:11 -0700 Subject: [PATCH] fix(forms): rename validator change fn due to conflict (#11492) Closes #11479 --- .../@angular/forms/src/directives/shared.ts | 13 ++++++----- .../forms/src/directives/validators.ts | 10 ++++---- .../forms/test/reactive_integration_spec.ts | 23 +++++++++++++------ tools/public_api_guard/forms/index.d.ts | 10 ++++---- 4 files changed, 33 insertions(+), 23 deletions(-) diff --git a/modules/@angular/forms/src/directives/shared.ts b/modules/@angular/forms/src/directives/shared.ts index 2ad20684ea..2ff9d74603 100644 --- a/modules/@angular/forms/src/directives/shared.ts +++ b/modules/@angular/forms/src/directives/shared.ts @@ -67,21 +67,22 @@ export function setUpControl(control: FormControl, dir: NgControl): void { // re-run validation when validator binding changes, e.g. minlength=3 -> minlength=4 dir._rawValidators.forEach((validator: Validator | ValidatorFn) => { - if ((validator).registerOnChange) - (validator).registerOnChange(() => control.updateValueAndValidity()); + if ((validator).registerOnValidatorChange) + (validator).registerOnValidatorChange(() => control.updateValueAndValidity()); }); dir._rawAsyncValidators.forEach((validator: Validator | ValidatorFn) => { - if ((validator).registerOnChange) - (validator).registerOnChange(() => control.updateValueAndValidity()); + if ((validator).registerOnValidatorChange) + (validator).registerOnValidatorChange(() => control.updateValueAndValidity()); }); } export function cleanUpControl(control: FormControl, dir: NgControl) { dir.valueAccessor.registerOnChange(() => _noControlError(dir)); dir.valueAccessor.registerOnTouched(() => _noControlError(dir)); - dir._rawValidators.forEach((validator: Validator) => validator.registerOnChange(null)); - dir._rawAsyncValidators.forEach((validator: Validator) => validator.registerOnChange(null)); + dir._rawValidators.forEach((validator: Validator) => validator.registerOnValidatorChange(null)); + dir._rawAsyncValidators.forEach( + (validator: Validator) => validator.registerOnValidatorChange(null)); if (control) control._clearChangeFns(); } diff --git a/modules/@angular/forms/src/directives/validators.ts b/modules/@angular/forms/src/directives/validators.ts index 7726cba257..60a084dd4e 100644 --- a/modules/@angular/forms/src/directives/validators.ts +++ b/modules/@angular/forms/src/directives/validators.ts @@ -35,7 +35,7 @@ import {NG_VALIDATORS, Validators} from '../validators'; */ export interface Validator { validate(c: AbstractControl): {[key: string]: any}; - registerOnChange?(fn: () => void): void; + registerOnValidatorChange?(fn: () => void): void; } export const REQUIRED_VALIDATOR: any = { @@ -77,7 +77,7 @@ export class RequiredValidator implements Validator { return this.required ? Validators.required(c) : null; } - registerOnChange(fn: () => void) { this._onChange = fn; } + registerOnValidatorChange(fn: () => void) { this._onChange = fn; } } /** @@ -138,7 +138,7 @@ export class MinLengthValidator implements Validator, return isPresent(this.minlength) ? this._validator(c) : null; } - registerOnChange(fn: () => void) { this._onChange = fn; } + registerOnValidatorChange(fn: () => void) { this._onChange = fn; } } /** @@ -188,7 +188,7 @@ export class MaxLengthValidator implements Validator, return isPresent(this.maxlength) ? this._validator(c) : null; } - registerOnChange(fn: () => void) { this._onChange = fn; } + registerOnValidatorChange(fn: () => void) { this._onChange = fn; } } @@ -237,5 +237,5 @@ export class PatternValidator implements Validator, return isPresent(this.pattern) ? this._validator(c) : null; } - registerOnChange(fn: () => void) { this._onChange = fn; } + registerOnValidatorChange(fn: () => void) { this._onChange = fn; } } diff --git a/modules/@angular/forms/test/reactive_integration_spec.ts b/modules/@angular/forms/test/reactive_integration_spec.ts index fab4d2461f..7685665643 100644 --- a/modules/@angular/forms/test/reactive_integration_spec.ts +++ b/modules/@angular/forms/test/reactive_integration_spec.ts @@ -8,13 +8,12 @@ import {Component, Directive, EventEmitter, Input, Output, forwardRef} from '@angular/core'; import {TestBed, fakeAsync, tick} from '@angular/core/testing'; -import {ControlValueAccessor, FormArray, FormControl, FormGroup, FormGroupDirective, FormsModule, NG_ASYNC_VALIDATORS, NG_VALIDATORS, NgControl, ReactiveFormsModule, Validator, Validators} from '@angular/forms'; +import {AbstractControl, ControlValueAccessor, FormArray, FormControl, FormGroup, FormGroupDirective, FormsModule, NG_ASYNC_VALIDATORS, NG_VALIDATORS, NG_VALUE_ACCESSOR, NgControl, ReactiveFormsModule, Validator, Validators} from '@angular/forms'; import {By} from '@angular/platform-browser/src/dom/debug/by'; import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter'; import {dispatchEvent} from '@angular/platform-browser/testing/browser_util'; import {ListWrapper} from '../src/facade/collection'; -import {AbstractControl} from '../src/model'; export function main() { describe('reactive forms integration tests', () => { @@ -981,7 +980,8 @@ export function main() { describe('custom value accessors', () => { it('should support custom value accessors', () => { const fixture = TestBed.createComponent(WrappedValueForm); - fixture.componentInstance.form = new FormGroup({'login': new FormControl('aa')}); + const form = new FormGroup({'login': new FormControl('aa')}); + fixture.componentInstance.form = form; fixture.detectChanges(); // model -> view @@ -992,7 +992,12 @@ export function main() { dispatchEvent(input.nativeElement, 'input'); // view -> model - expect(fixture.componentInstance.form.value).toEqual({'login': 'bb'}); + expect(form.value).toEqual({'login': 'bb'}); + + // custom validator + expect(form.get('login').errors).toEqual({'err': true}); + form.setValue({login: 'expected'}); + expect(form.get('login').errors).toEqual(null); }); it('should support custom value accessors on non builtin input elements that fire a change event without a \'target\' property', @@ -1549,20 +1554,24 @@ export function main() { @Directive({ selector: '[wrapped-value]', - host: {'(input)': 'handleOnInput($event.target.value)', '[value]': 'value'} + host: {'(input)': 'handleOnInput($event.target.value)', '[value]': 'value'}, + providers: [ + {provide: NG_VALUE_ACCESSOR, multi: true, useExisting: WrappedValue}, + {provide: NG_VALIDATORS, multi: true, useExisting: WrappedValue} + ] }) class WrappedValue implements ControlValueAccessor { value: any; onChange: Function; - constructor(cd: NgControl) { cd.valueAccessor = this; } - writeValue(value: any) { this.value = `!${value}!`; } registerOnChange(fn: (value: any) => void) { this.onChange = fn; } registerOnTouched(fn: any) {} handleOnInput(value: any) { this.onChange(value.substring(1, value.length - 1)); } + + validate(c: AbstractControl) { return c.value === 'expected' ? null : {'err': true}; } } @Component({selector: 'my-input', template: ''}) diff --git a/tools/public_api_guard/forms/index.d.ts b/tools/public_api_guard/forms/index.d.ts index cbef32528a..4224dddc07 100644 --- a/tools/public_api_guard/forms/index.d.ts +++ b/tools/public_api_guard/forms/index.d.ts @@ -321,7 +321,7 @@ export declare class FormsModule { export declare class MaxLengthValidator implements Validator, OnChanges { maxlength: string; ngOnChanges(changes: SimpleChanges): void; - registerOnChange(fn: () => void): void; + registerOnValidatorChange(fn: () => void): void; validate(c: AbstractControl): { [key: string]: any; }; @@ -331,7 +331,7 @@ export declare class MaxLengthValidator implements Validator, OnChanges { export declare class MinLengthValidator implements Validator, OnChanges { minlength: string; ngOnChanges(changes: SimpleChanges): void; - registerOnChange(fn: () => void): void; + registerOnValidatorChange(fn: () => void): void; validate(c: AbstractControl): { [key: string]: any; }; @@ -433,7 +433,7 @@ export declare class NgSelectOption implements OnDestroy { export declare class PatternValidator implements Validator, OnChanges { pattern: string; ngOnChanges(changes: SimpleChanges): void; - registerOnChange(fn: () => void): void; + registerOnValidatorChange(fn: () => void): void; validate(c: AbstractControl): { [key: string]: any; }; @@ -446,7 +446,7 @@ export declare class ReactiveFormsModule { /** @stable */ export declare class RequiredValidator implements Validator { required: boolean; - registerOnChange(fn: () => void): void; + registerOnValidatorChange(fn: () => void): void; validate(c: AbstractControl): { [key: string]: any; }; @@ -478,7 +478,7 @@ export declare class SelectMultipleControlValueAccessor implements ControlValueA /** @stable */ export interface Validator { - registerOnChange?(fn: () => void): void; + registerOnValidatorChange?(fn: () => void): void; validate(c: AbstractControl): { [key: string]: any; };