需要 angular 2+ 'number only' 使用类型作为数字、正则表达式并允许复制粘贴的指令

Question

我有一个输入类型编号。我有一个成功阻止数字以外的字符的指令。而且这也只允许一个小数点。

我需要的是，指令应该允许从字段复制并粘贴到字段中。

<input type="number" appNumbersOnly />

import { Directive, ElementRef, HostListener } from "@angular/core";

@Directive({
    selector: '[appNumbersOnly]'
  })
export class NumbersOnlyDirective {
    public text;
    private regex: RegExp = new RegExp(/^-?[0-9]+(\.[0-9]*){0,1}$/g);
    private specialKeys: Array<string> = ['Backspace', 'Tab'];

    constructor(private el: ElementRef) {}
    @HostListener('keypress', ['$event']) onKeyDown(event: KeyboardEvent) {
      if (this.specialKeys.indexOf(event.key) !== -1) return;

      const current: string = this.el.nativeElement.value;
      const next: string = current.concat(event.key);

      if(next.includes('.')){
        if(this.text == next) event.preventDefault();
        this.text= next;
      }
      if ((next && !String(next).match(this.regex))) {  
        event.preventDefault();
      }
    }
  }

如何使该指令允许复制粘贴？

Answer 1

我不确定你的要求。但我认为这可以帮助你。

复制

粘贴

需要 angular 2+ 'number only' 使用类型作为数字、正则表达式并允许复制粘贴的指令

Need angular 2+ 'number only' directive that uses type as number, regex and allows copy paste

regex

angular-directive

angular