如何删除输入时输入的特殊字符？（角度）

Question

在输入字段中输入时如何删除特殊字符。我使用 (keyup) 或 (keydown) 并替换它。我附上了代码。我将不胜感激任何帮助。谢谢！

removeSpecialCharacters(event) {
    let newVal = event.target.value.replace('[^A-Za-z0-9]', '');
    return newVal;
  }

<input maxlength="10" (keydown)="this.removeSpecialCharacters($event)">

Answer 1

您可以使用该指令

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

  regexStr = '^[a-zA-Z0-9_]*$';
  @Input() isAlphaNumeric: boolean;

  constructor(private el: ElementRef) { }


  @HostListener('keypress', ['$event']) onKeyPress(event) {
    return new RegExp(this.regexStr).test(event.key);
  }

  @HostListener('paste', ['$event']) blockPaste(event: KeyboardEvent) {
    this.validateFields(event);
  }

  validateFields(event) {
    setTimeout(() => {

      this.el.nativeElement.value = this.el.nativeElement.value.replace(/[^A-Za-z ]/g, '').replace(/\s/g, '');
      event.preventDefault();

    }, 100)
  }

}

就像<input specialIsAlphaNumeric placeholder="my love" value="Mam"> 不要忘记在ngModule 的声明中添加 Directive 类