javascript - 用于字符串操作的 ng-Mask

Question

我正在尝试转换/仅允许输入中定义的掩码值。 可以说 - 大写。 掩码“A”正则表达式:[A-Z]

<input type="text" class="form-control" mask="AAAA">

仅需要 [A-Z] 大写字符，范围为​​ 4 (ABCD)。 但上述代码既没有转换为大写，也没有限制为小写。 任何建议将不胜感激。 谢谢

Answer 1

如果您想限制用户输入并以大写形式显示字符，那么您可以创建一个指令来实现该行为。

例如 -

@Directive({
  selector: '[char-mask]'
})
export class CharDirective {
  @Input() upperCase = true;

  @HostBinding('class.upper')
  get upper() {
    return this.upperCase;
  }

  @HostListener('keydown', ['$event'])
  onKeydown(e) {
    if (!this.validateKeyCode(e.keyCode, e.target.value)) {
      e.preventDefault();
    }
  }

  private validateKeyCode(keyCode: number, value: string): boolean {
    var inp = String.fromCharCode(keyCode);
    if ((/[a-zA-Z]/.test(inp)) && (value.length <= 3)) {
      return true;
    }
    const whiteListedCodes = [8, 9, 13, 16, 37, 39];
    if (whiteListedCodes.indexOf(keyCode) > -1) {
      return true;
    }
  }

并在需要行为的输入上使用 not。

<input class="form-control" char-mask />

具体实现可以引用 - https://stackblitz.com/edit/angular-char-only-mask?file=src/app/char-mask.ts

希望对您有所帮助。