Question

我有一个用于文本输入的指令，该指令可以替换文本符号，并且只能键入十进制数字。

这是此指令的代码

import { NgControl } from '@angular/forms';
import { HostListener, Directive } from '@angular/core';

@Directive({
    exportAs: 'decimal-number-directive',
    selector: 'decimal-number-directive, [decimal-number-directive]'
})
export class DecimalNumberDirective {
    private el: NgControl;
    constructor(ngControl: NgControl) {
        this.el = ngControl;
    }
    // Listen for the input event to also handle copy and paste.
    @HostListener('input', ['$event.target.value'])
    onInput(value: string) {
        // Use NgControl patchValue to prevent the issue on validation
        this.el.control.patchValue(value.replace(/[^0-9].[^0-9]/, ''));
    }
}

现在我可以写n-数字十进制符号。我只需要两个。我该怎么做？

Answer 1

所以要显示小数位并且不允许使用符号，我需要这样编写指令

    import { NgControl } from '@angular/forms';
import { HostListener, Directive, ElementRef } from '@angular/core';

@Directive({
    exportAs: 'decimal-number-directive',
    selector: 'decimal-number-directive, [decimal-number-directive]',
})
export class DecimalNumberDirective {
    private regex: RegExp = new RegExp(/^\d*\.?\d{0,2}$/g);
    private specialKeys: Array<string> = ['Backspace', 'Tab', 'End', 'Home', '-'];
    constructor(private el: ElementRef) {}
    @HostListener('keydown', ['$event'])
    onKeyDown(event: KeyboardEvent) {
        console.log(this.el.nativeElement.value);
        // Allow Backspace, tab, end, and home keys
        if (this.specialKeys.indexOf(event.key) !== -1) {
            return;
        }
        let current: string = this.el.nativeElement.value;
        let next: string = current.concat(event.key);
        if (next && !String(next).match(this.regex)) {
            event.preventDefault();
        }
    }
}

Answer 2

在模式[^0-9].[^0-9]中，您要用空字符串替换3个字符。您不匹配数字，除了使用点的换行符以外的任何字符，再也不使用negated character class [^

匹配数字。

如果要删除除数字和点以外的所有字符，您仍然不确定格式是否正确，因为...可能也有效。

请尝试使用小数点后2个小数点匹配一个值，而不是替换。

^[0-9]+\.[0-9]{2}$

如果允许以点开头，则可以使用*代替+：

^[0-9]*\.[0-9]{2}$

使用test的示例：

let pattern = /^[0-9]+\.[0-9]{2}$/;
["2.22", "....", "1", "3.299"].forEach(s => console.log(s + ": " + pattern.test(s)));

或使用match：

let pattern = /^[0-9]+\.[0-9]{2}$/;
["2.22", "....", "1", "3.299"].forEach(s => {
  let res = s.match(pattern);
  console.log((null === res ? "No match: " : "Match: ") + s)
});

点后仅保留两位小数（角度）

2 个答案: