寶慕林4294392
2021-09-04 15:07:45
我有一個 Angular 表單,我希望用戶只提交一個完整的數(shù)字(不是十進制),并且他不能選擇在表單中寫入 .(點)符號來寫入十進制數(shù)。我想完全阻止在表單上寫 .(dot) 的選項。是否可以?在 component.ts 添加這個功能_keyUp(event: any) { const pattern = /[0-9\+\-\ ]/; let inputChar = String.fromCharCode(event.charCode); if (!pattern.test(inputChar)) { // invalid character, prevent input event.preventDefault(); }}在您的模板中使用以下內(nèi)容<input(keyup)="_keyUp($event)">但它不起作用,仍然可以選擇在表單上寫 .(dot) 。我想完全阻止在表單上寫 .(dot) 的選項。
2 回答

qq_遁去的一_1
TA貢獻1725條經(jīng)驗 獲得超8個贊
我相信在keyup
事件發(fā)生時角色已經(jīng)在場,你無法阻止已經(jīng)發(fā)生的事情。嘗試keypress
事件:
<input (keypress)="_keyUp($event)">

慕少森
TA貢獻2019條經(jīng)驗 獲得超9個贊
有一些額外的想法:這個(發(fā)現(xiàn))stackblitz我會說它做得更好:
組件html:
<input (keypress)="numberOnly($event)" type="text">
和 TS 文件:
numberOnly(event): boolean {
const charCode = (event.which) ? event.which : event.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
為什么更好?
沒有正則表達式:俗話說,如果你試圖用正則表達式解決一個問題,現(xiàn)在你有兩個問題。
Keypress,它會更接近你想要的,而無需更換字符串
更好的事件名稱。如果我有我的 druthers _namesOfAnything 永遠不會成為一件事。
添加回答
舉報
0/150
提交
取消