Измените этот пользовательский валидатор или метод маскировки, чтобы валидация даты работала правильно, если пользователь редактирует текст в позиции дня или месяца - PullRequest
Новая
       52

Измените этот пользовательский валидатор или метод маскировки, чтобы валидация даты работала правильно, если пользователь редактирует текст в позиции дня или месяца

0 голосов
/ 07 октября 2019

Если пользователь вводит полную действительную дату, а затем вносит изменения в позиции дня или месяца, проверка завершается неудачно, несмотря на то, что пользователь вводит правильную дату.

Вот мой HTML-код для поля ввода: 

<div class="col-md-8">
  <input
    maxlength=10
    minlength=10
    formControlName="dob"
    class="form-control col-md-5"
    id="home-registration-dob"
    placeholder="MM/DD/YYYY"
    (input)="maskInputDate($event)"
    type="text"
  />
  <div class="invalid-feedback d-block" 
    *ngIf="registerFormControl['dob'].errors?.required" >
       Date of Birth is required
  </div>
  <div class="invalid-feedback d-block" 
    *ngIf="registerFormControl['dob'].errors && 
    !registerFormControl['dob'].errors?.required" >
      Invalid Date of Birth
   </div>
 </div>

Вот мой пользовательский валидатор для даты: 

    static dateFormatDDMMYY(control: AbstractControl) {
      const isValid = (/^\d{2}\/\d{2}\/\d{4}$/).test(control.value);
      if (isValid) {
        const temp = control.value.split('/');
        const d = new Date(temp[2] + '/' + temp[0] + '/' + temp[1]);
        const year = temp[2]
        const currentYear = new Date().getFullYear();

        const result = (d && (d.getMonth() + 1) == temp[0] && d.getDate() == Number(temp[1]) && d.getFullYear() == Number(temp[2]));
        const currentDate: any = new Date();
        if (result && (d < currentDate.setHours(0, 0, 0, 0)) && (currentYear >= Number(year)+8)) {
          return null;
        }
      }
      return { pastMonthFormat: true };
    }

Вот мой метод маскировки: 

    maskInputDate(e) {
      const t = e.target.value.replace(/\D/g, '').match(/(\d{0,2})(\d{0,2})(\d{0,4})/);
      e.target.value = t[2] ? t[1] + '/' + t[2] + (t[3] ? '/' + t[3] : '') : t[1];
    }

Что я могу сделать, чтобы изменить метод маскирования илипользовательский валидатор, чтобы когда пользователь мог вносить изменения в любую позицию для поля даты и иметь правильную валидацию?

Еще одна идея, которую я пытался реализовать, заключается в том, чтобы форсировать валидацию каждый раз, когда пользователь изменяет значение на входеполе. Технически это уже должно происходить. Однако я наблюдаю, что, если пользователь изменяет значения дня или месяца, приложение всегда будет показывать значение как недействительное. Однако, если я изменяю значения дня или месяца, я должен также изменить значение года, и тогда проверка работает.

...