Как поместить правильное сообщение об ошибке при вводе любого алфавита или специального символа в <input matInput type="number">?
Я пытался сделать в компоненте
min = 0; port: new FormControl('', [this.validatePort(this.min)]),port: new FormControl('', Validators.required)
и в хтмл
<mat-form-field class = "inputnumber">
<input matInput type = "number" placeholder = "Enter Port" formControlName = "port" required>
<mat-error>
{{errors.port}}
</mat-error>
</mat-form-field>
Я хочу ограничить ввод алфавита и специальных символов в номер типа ввода с помощью правильного сообщения об ошибке. В настоящее время, если я ввел алфавит или специальный символ, я не могу писать, но хочу показать для этого какое-то сообщение об ошибке.
Я использую угловой 7.2.2
Кстати, я думаю, вам следует добавить валидаторы и отображать ошибку только при ее наличии (вы можете справиться с этим с помощью if condition). Вот ссылка на валидаторы Angular: angular.io/api/forms/Валидаторы
@Sarkar Один раз добавили проверку ответа
@ Альберто, используя Angular 7.
Ответы 1
Это сделает то, что вы хотите:
Установите min и max для FormControl в Component.ts
HTML-код:
<mat-form-field class = "inputnumber">
<input matInput type = "number" placeholder = "Enter Port" [formControl] = "port" required>
<mat-error *ngIf = "port.invalid">
Your Error Message
</mat-error>
</mat-form-field>
Код ТС:
port = new FormControl('', [Validators.required, Validators.max(15), Validators.min(0)]);
Но этот код также позволяет пользователю вводить алфавиты и специальные символы, хотя он не отображается (мой текущий код приложения имеет только логику этого типа). Но мне нужно показывать некоторое сообщение об ошибке всякий раз, когда пользователь пытается ввести что-то еще, кроме число в этом вводе.
да, вы должны создать свой собственный regEx, используя свойство Validators
@S.Sarkar Попробуйте этот шаблон: (?<=\s|^)\d+(?=\s|$)
Привет, вы используете угловой 1.7 или угловой 7?