Angular Пользовательский валидатор: - PullRequest
Новая
       17

Angular Пользовательский валидатор:

0 голосов
/ 14 февраля 2020

Пользовательский валидатор, который я сейчас использую: 

static digitOnly(digit: string): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
        const restrict = [];
        for (let i = 0; i < parseInt(digit); i++) {
            restrict.push('0');
        }
        const val = control.value;
        if (val === null || val === '') {
            return null;
        }
        if (restrict.toString().replace(/,/g,'') === val.toString()) {
            return { 'invalidNumber': true };
        }
       const pattern = new RegExp(`^[0-9]{${digit}}$`);
        if (!val.toString().match(pattern)) {
            return { 'invalidNumber': true };
        }
        return null;
    }
}

Описание:

Я хочу добавить пользовательский валидатор в поле ввода, которое принимает GPA, требование: введенное значение не может быть больше 400 или пустым или 0 или 1

прямо сейчас: мой пользовательский валидатор работает для следующих условий: проверка 000 как недействительного, что является правильной проверкой 0 или 1 или цифры c single di git как недействительный, который является правильным

Единственная проблема заключается в том, что он принимает значения выше 400

, ожидая быстрой помощи.

1 Ответ

0 голосов
/ 14 февраля 2020 
import { Directive } from '@angular/core';
import { AbstractControl, NG_VALIDATORS, Validator } from '@angular/forms';

@Directive({
    selector: '[forbidden]',
    providers: [
        {
            provide: NG_VALIDATORS,
            useExisting: ForbiddenValidator,
            multi: true
        }
    ]
})

export class ForbiddenValidator implements Validator {

    /**
     * Verify if the value it is allowed or not
     * @param control form control which is evaluated
     */
    validate(control: AbstractControl): { [key: string]: any } | null {
        if (control.value.length < 3 || control.value === '')
            return { 'forbidden': true };

        let num = parseInt(control.value);
        return num > 400 ? { 'forbidden': true } : null;
    }
}

Это будет ваша пользовательская директива валидатора, затем в вашем шаблоне: 

<form #form="ngForm">
  <input nz-input id="property" name="property" [(ngModel)]="someVariable 
  (ngModelChange)="onChange()" forbidden #property="ngModel">

  <div *ngIf="property.invalid && property.errors.forbidden>
       Invalid value
  </div>
</form>
...