ограничить спецсимвол в поле ввода HTML с помощью Angular 7

Question

Мне нужно ограничить специальный символ в поле ввода html с помощью Angular 7. Точно так же у меня есть некоторые другие требования, такие как ввод только цифры, буквы и т. Д.

Я новичок в Angular, любая помощь будет оценена.

Я пробовал с кодом ниже:

<input type="text" maxlength="45" class="form-control" id="hno" [(ngModel)]="Address.number" pattern="^[^`~!@#$%\^&*()_+={}|[\]\\:';"<>?,./]*$">

Answer 1

Ваш атрибут pattern должен выглядеть следующим образом:

pattern="[^`~!@#$%\^&*()_+={}|[\]\\:';<>?,./\x22]*"

Во-первых, вам НЕ следует использовать ^ и $, поскольку вы сопоставляете каждый отдельный символ с этим шаблоном.

Во-вторых, проблема с символом ". Так что пока я просто удалил его из класса, я буду больше в него изучать.

UPD : найдено решение для символа кавычки здесь . \x22 работает как " символ.

Вот рабочий пример: https://jsfiddle.net/qy5m07uh/