Как в реактивных формах Angular предотвратить ввод определённых символов?

Подскажите пример, как реализовать для определённых полей ввод, например только цифр, кириллических символов, либо ограничить по количеству, или только по определённому регулярному выражению.
Валидаторы определяют уже имеющуюся ошибку, а мне нужно как-то предотвратить ввод, если для поля только, скажем 4 символа нужно либо же иное правило.
Я уже думал через декораторы проверку делать и если не проходит, то отклонять, и библиотеки смотрел, но реализовать задуманное пока что не удалось.
Как сделать банальное ограничение ввода символов?


Ответы (1 шт):

Автор решения: Alexander Chernin

Что-то типа такого?

html:

<input [ngModel]="validValue" (ngModelChange)="onInput($event)">

ts:

class MyComponent {
    onInput(inputValue: string): void {
        // Не более 4-х символов
        this.value = inputValue.substring(0, 4);
        // Или число
        if (Number.isNumber(+inputValue)) {
            this.value = inputValue;
        } else {
            this.value = '';
        }
    }
}
→ Ссылка