如何解决angular 8仅接受数字自定义指令在台式机浏览器中工作,但不适用于移动chrome浏览器
我创建了一个自定义指令,仅接受数字。在桌面浏览器和safari移动版中可以正常工作,但在移动chrome版中不能正常工作。
任何人都可以帮助我解决这个问题。在此先感谢
这是我的HTML和指令
<input NumbersOnly placeholder="{{ 'PlaceHolder.MobileNo' | translate }}" formControlName="mobileNo" maxlength="7" >
import { Directive,ElementRef,HostListener,Input } from "@angular/core";
@Directive({
selector: "[NumbersOnly]",})
export class NumbersDirective {
// Allow decimal numbers and negative values
private regex: RegExp = new RegExp(/^-?[0-9]+(\[0-9]*){0,1}$/g);
// Allow key codes for special events. Reflect :
// Backspace,tab,end,home
private specialKeys: Array<string> = ["Backspace","Tab","End","Home","-"];
constructor(private el: ElementRef) {}
@HostListener("keydown",["$event"])
onKeyDown(event: KeyboardEvent) {
// Allow Backspace,and home keys
if (this.specialKeys.indexOf(event.key) !== -1) {
return;
}
if (event.key.match(this.regex) == null) {
event.preventDefault();
return false;
}
}
}
解决方法
我看到您错过了正则表达式中的点。您不需要g
修饰符,因为整个字符串必须匹配。
使用
private regex: RegExp = /^-?[0-9]+(?:\.[0-9]*)?$/;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。