У меня есть поле ввода в моем шаблоне, и я хотел бы поймать каждое нажатие клавиши и обновить значение в DOM, удалив пустые пробелы - обрезать.
Я могу поймать событие, и функция, которую я создаю, работает правильно, но значение в текстовом поле ввода не обновляется соответствующим образом.
@HostListener('input', [ '$event.target.value' ])
input( value ) {
console.log('value! ' + value);
value = value.replace(/\s/gi, '');
console.log('value after trim ' + value);
return true;
}
Любая идея?
3 ответа
Вы можете просто использовать событие keyup
и вызвать метод, чтобы обрезать ваше значение. Typescript предоставляет вам trim()
функцию.
Ваш html будет выглядеть так:
<input (keyup)="keyUp($event)">
... и определите метод в вашем коде машинописи:
keyUp(event){
event.target.value = event.target.value.trim();
}
Ссылка на Plunker Demo
При использовании Angular, попробуйте на самом деле использовать Angular.
Теперь [(ngModel)]="myInput"
и (ngModelChange)="cleanup()"
создают функцию в файле ts:
cleanup() {
this.myInput = this.myInput.replace(/ /g, '');
}
Более простой способ сделать это, с меньшим количеством кода и преимуществом предотвращения ввода пробела и перемещения каретки обратно в пространство, как принятое решение.
<input (keydown.space)="$event.preventDefault()">
Плункер здесь
Вы можете ответить здесь.
Похожие вопросы
Связанные вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.