Применение валидатора шаблонов для ввода номера типа Angular 6

У меня есть реактивная форма, и в одно из полей пользователь может ввести только положительное, а не десятичное число.

this.projectForm = new FormGroup({
      'id': new FormControl(null, [Validators.required]),
      'name': new FormControl(null, [Validators.required]),
      'seqNo': new FormControl(null, [Validators.required, Validators.pattern(/^[1-9]+[0-9]*$/)]) 
    });

Когда я сохраняю текст как тип ввода, обе проверки запускаются без каких-либо проблем. Я не могу ввести кроме положительного числа int.

        <input type="text" id="seqNo" class="form-control" placeholder="Seq No" formControlName="seqNo" min="1" step="1">
        <span class="mwk-validation-error form-text" *ngIf="!projectForm.get('seqNo').valid && projectForm.get('seqNo').errors?.required">Seq no is required!</span>
        <span class="mwk-validation-error form-text" *ngIf="!projectForm.get('seqNo').valid && !projectForm.get('seqNo').errors?.required">Seq no must be positive number</span>

Я хочу использовать тип ввода = число здесь. Вопрос

  • на алфавитах он обрабатывается как ничего не введено, поэтому требуется отображение сообщений.
  • и это позволяет мне ввести десятичное значение, проверка шаблона не срабатывает для меня

Как это исправить? Я не хочу писать пользовательскую проверку, так как для алфавитов это не сработает.

0 ответов

 <span *ngIf="projectForm.hasError('required', 'seqNo')">
                        Name is required.
                    </span>

попробуй вот так

Другие вопросы по тегам