如何添加RegExp到一个角8指令支持负十进制数?

Question

我有以下指令:

import {Directive, ElementRef, HostListener, Input} from '@angular/core';
@Directive({
selector: '[signedNumeric]'
})
export class SignedNumericDirective {

private regex = {               
decimal: new RegExp(/^[0-9]+(?:.[0-9]{0,2})?$/g)
};                          
private specialKeys = {       
decimal: [ 'Backspace', 'Delete', 'Tab', 'End', 'Home', 'ArrowLeft', 'ArrowRight' ]
};
constructor(private el: ElementRef) {
}
@HostListener('keydown', [ '$event' ])
onKeyDown(event: KeyboardEvent) {
if (this.specialKeys['decimal'].indexOf(event.key) !== -1) {
return;
}
// Do not use event.keycode this is deprecated.
// See: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
let current: string = this.el.nativeElement.value;
let next: string = current.concat(event.key);
if (next && !String(next).match(this.regex['decimal'])) {
event.preventDefault();
}
}
}

下面是如何在模板中使用指令:

<input type="text" name="sample" id="sample" autocomplete="off"
[(ngModel)]="decinmalVal" maxlength="6" signedNumeric>

这适用于正小数，如34.45 0.7 1200.6，但不允许负数。我尝试将RegExp更新为:

decimal: new RegExp(/^-?[0-9]d*(.d+)?$/g)

没有成功。reg exp在线测试，但它在指令中不起作用。我不知道哪里不对。

Answer 1

您可以使用以下正则表达式进行实时输入验证

/^-?d*(?:.d*)?$/

细节:

• ^-字符串
起始
• -?-可选-
• d*- 0或多个数字
• (?:.d*)?-一个可选的点序列，然后是零或多个数字
• $-字符串结束