Question

我想知道如何为输入字段创建带有正则表达式的掩码。

我需要在字段中添加一些掩码，例如：yyyy / yyyy。这听起来像是一个时期。

我看到一个使用Angular2管道创建掩码的链接。这是link。

所以，我想创建一个具有不同正则表达式的管道，以允许用户只写这个：yyyy / yyyy;并使用管道中的transform方法。这可能吗？

这是我的管道和格式化程序：

import { Pipe, PipeTransform } from "@angular/core";
@Pipe({ name: "mypipe" })
export class MyPipe implements PipeTransform {
  private SEPARATOR: string;
  constructor() {
    this.SEPARATOR = "/";
  }
  transform(value): string {
    let integer = (value || "").toString();
    // Here is where the code should be, to transform the value
    return integer;
  }
  transform(value): string {
    // parse method
  }
}

import { Directive, HostListener, ElementRef, OnInit } from "@angular/core";
// import { MyPipe } from ...
@Directive({ selector: "[myFormatter]" })
export class MyFormatterDirective implements OnInit {
  private el: HTMLInputElement;
  constructor(
    private elementRef: ElementRef,
    private mypipe: MyPipe
  ) {
    this.el = this.elementRef.nativeElement;
  }
  ngOnInit() {
    this.el.value = this.mypipe.transform(this.el.value);
  }
  @HostListener("keydown", ["$event.target.value"])
  handleKeyboardEvent(value) {
    this.el.value = this.mypipe.transform(value);
  }
}

如何在angular2中添加掩码'yyyy / yyyy'，使用管道和格式化程序输入字段

0 个答案: