Angular2 타이핑 패턴 지시문

Question

주어진 패턴과 일치하지 않는 문자열을 입력하거나 붙여 넣지 못하게하는 입력에 (ngModel을 사용하여) 추가 할 수있는 지시문을 찾고 있습니다.

keypress에서 모델을 업데이트하여 작성할 수 있었지만 복사 및 붙여 넣기 문제를 해결하는 방법을 잘 모르겠습니다. 여기

내가 지금까지 쓴 것입니다 :

import { Directive, Input, HostListener, EventEmitter } from "@angular/core" 


@Directive({ 
    selector: '[ngModel][typingPattern]' 
}) 

export class TypingPatternDirective { 

    @Input() typingPattern: string 
    @Input() ngModel 
    @Output() ngModelChange = new EventEmitter() 
    private oldValue: any 

    /* On key down, we record the old value */ 
    @HostListener('keydown', ['$event']) 
    onKeyDown($event) { 
    this.oldValue = $event.target.value 
    if($event.keyCode === 32) { // Prevent space key 
     $event.preventDefault() 
    } 
    } 

    /* On changing value, we check if the max length is reached. If not, we do nothing, otherwise we put the old value */ 
    @HostListener('keypress', ['$event']) 
    onKeypress($event) { 
    if (!$event.target.value.match(new RegExp(this.typingPattern))) { 
     $event.target.value = this.oldValue.trim() 
     this.ngModelChange.emit($event.target.value) 
    } 
    } 

} 

나는이 복사 및 붙여 넣기를 처리하지 않습니다 했나요한다. 나는이 지시자를 항상 input 엘리먼트에서 사용하기를 원한다. (그래서 나는 그것이 현재의 경우가 아닌 InputComponent 에러 상태를 업데이트하고 싶다.)

Answer 1

npm install angular2-text-mask을 사용해보십시오. 귀하의 필요에 맞는 것 같습니다.