refactor(forms): update minlength/maxlength to inherit abstractValida…

…tor (#43998) Modified minlength and maxlength validator to inherit abstractValidator For every validator type different PR will be raised as discussed in #42378. Closes #42267 PR Close #43998
angular · Nov 5, 2021 · 210f7e5 · 210f7e5
1 parent 8f840c3
commit 210f7e5
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 82 deletions.
diff --git a/goldens/public-api/forms/forms.md b/goldens/public-api/forms/forms.md
@@ -454,14 +454,10 @@ export class FormsModule {
 }
 
 // @public
-export class MaxLengthValidator implements Validator, OnChanges {
-    // (undocumented)
-    enabled(): boolean;
+export class MaxLengthValidator extends AbstractValidatorDirective implements OnChanges {
     maxlength: string | number | null;
     // (undocumented)
     ngOnChanges(changes: SimpleChanges): void;
-    registerOnValidatorChange(fn: () => void): void;
-    validate(control: AbstractControl): ValidationErrors | null;
     // (undocumented)
     static ɵdir: i0.ɵɵDirectiveDeclaration<MaxLengthValidator, "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", never, { "maxlength": "maxlength"; }, {}, never>;
     // (undocumented)
@@ -479,14 +475,10 @@ export class MaxValidator extends AbstractValidatorDirective implements OnChange
 }
 
 // @public
-export class MinLengthValidator implements Validator, OnChanges {
-    // (undocumented)
-    enabled(): boolean;
+export class MinLengthValidator extends AbstractValidatorDirective implements OnChanges {
     minlength: string | number | null;
     // (undocumented)
     ngOnChanges(changes: SimpleChanges): void;
-    registerOnValidatorChange(fn: () => void): void;
-    validate(control: AbstractControl): ValidationErrors | null;
     // (undocumented)
     static ɵdir: i0.ɵɵDirectiveDeclaration<MinLengthValidator, "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", never, { "minlength": "minlength"; }, {}, never>;
     // (undocumented)

diff --git a/packages/forms/src/directives/validators.ts b/packages/forms/src/directives/validators.ts
@@ -572,50 +572,24 @@ export const MIN_LENGTH_VALIDATOR: any = {
   providers: [MIN_LENGTH_VALIDATOR],
   host: {'[attr.minlength]': 'enabled() ? minlength : null'}
 })
-export class MinLengthValidator implements Validator, OnChanges {
-  private _validator: ValidatorFn = nullValidator;
-  private _onChange?: () => void;
-
+export class MinLengthValidator extends AbstractValidatorDirective implements OnChanges {
   /**
    * @description
    * Tracks changes to the minimum length bound to this directive.
    */
-  @Input()
-  minlength!: string|number|null;  // This input is always defined, since the name matches selector.
-
-  /** @nodoc */
-  ngOnChanges(changes: SimpleChanges): void {
-    if ('minlength' in changes) {
-      this._createValidator();
-      if (this._onChange) this._onChange();
-    }
-  }
-
-  /**
-   * Method that validates whether the value meets a minimum length requirement.
-   * Returns the validation result if enabled, otherwise null.
-   * @nodoc
-   */
-  validate(control: AbstractControl): ValidationErrors|null {
-    return this.enabled() ? this._validator(control) : null;
-  }
+  @Input() minlength!: string|number|null;
+  /** @internal */
+  override inputName = 'minlength';
 
-  /**
-   * Registers a callback function to call when the validator inputs change.
-   * @nodoc
-   */
-  registerOnValidatorChange(fn: () => void): void {
-    this._onChange = fn;
-  }
+  /** @internal */
+  override normalizeInput = (input: string|number): number => toInteger(input);
 
-  private _createValidator(): void {
-    this._validator =
-        this.enabled() ? minLengthValidator(toInteger(this.minlength!)) : nullValidator;
-  }
+  /** @internal */
+  override createValidator = (minlength: number): ValidatorFn => minLengthValidator(minlength);
 
   /** @nodoc */
-  enabled(): boolean {
-    return this.minlength != null /* both `null` and `undefined` */;
+  ngOnChanges(changes: SimpleChanges): void {
+    this.handleChanges(changes);
   }
 }
 
@@ -655,49 +629,24 @@ export const MAX_LENGTH_VALIDATOR: any = {
   providers: [MAX_LENGTH_VALIDATOR],
   host: {'[attr.maxlength]': 'enabled() ? maxlength : null'}
 })
-export class MaxLengthValidator implements Validator, OnChanges {
-  private _validator: ValidatorFn = nullValidator;
-  private _onChange?: () => void;
-
+export class MaxLengthValidator extends AbstractValidatorDirective implements OnChanges {
   /**
    * @description
-   * Tracks changes to the maximum length bound to this directive.
-   */
-  @Input()
-  maxlength!: string|number|null;  // This input is always defined, since the name matches selector.
-
-  /** @nodoc */
-  ngOnChanges(changes: SimpleChanges): void {
-    if ('maxlength' in changes) {
-      this._createValidator();
-      if (this._onChange) this._onChange();
-    }
-  }
-
-  /**
-   * Method that validates whether the value exceeds the maximum length requirement.
-   * @nodoc
+   * Tracks changes to the minimum length bound to this directive.
    */
-  validate(control: AbstractControl): ValidationErrors|null {
-    return this.enabled() ? this._validator(control) : null;
-  }
+  @Input() maxlength!: string|number|null;
+  /** @internal */
+  override inputName = 'maxlength';
 
-  /**
-   * Registers a callback function to call when the validator inputs change.
-   * @nodoc
-   */
-  registerOnValidatorChange(fn: () => void): void {
-    this._onChange = fn;
-  }
+  /** @internal */
+  override normalizeInput = (input: string|number): number => toInteger(input);
 
-  private _createValidator(): void {
-    this._validator =
-        this.enabled() ? maxLengthValidator(toInteger(this.maxlength!)) : nullValidator;
-  }
+  /** @internal */
+  override createValidator = (maxlength: number): ValidatorFn => maxLengthValidator(maxlength);
 
   /** @nodoc */
-  enabled(): boolean {
-    return this.maxlength != null /* both `null` and `undefined` */;
+  ngOnChanges(changes: SimpleChanges): void {
+    this.handleChanges(changes);
   }
 }