私はディレクティブ以下の作成しただけ

Question

テキストは数字だけが

がそれです（私はテキストをコピーし、テキストボックスに貼り付けると、それが受け入れてますが受け入れない）のキーコードを使用して許可できるように、角度2でディレクティブを作成する方法置き換える使用すると、パターンが数字やテキスト

角度4ディレクティブを制限することが可能私は、パターンを使用してangularJSでディレクティブを作成し、

を交換している

import {Directive,HostListener,HostBinding,Input ,Renderer,ElementRef} from '@angular/core' 


@Directive({ 
    selector: '[OnlyNumber]' 
}) 

export class InputRestricter { 

    constructor(private el: ElementRef) { } 

    @Input() OnlyNumber: boolean; 

    @HostListener('keydown', ['$event']) onKeyDown(event:any) { 
     let e = <KeyboardEvent>event; 
     if (this.OnlyNumber) { 
      if ([46, 8, 9, 27, 13, 110, 190].indexOf(e.keyCode) !== -1 || 
       // Allow: Ctrl+A 
       (e.keyCode === 65 && (e.ctrlKey || e.metaKey)) || 
       // Allow: Ctrl+C 
       (e.keyCode === 67 && (e.ctrlKey || e.metaKey)) || 
       // Allow: Ctrl+V 
       (e.keyCode === 86 && (e.ctrlKey || e.metaKey)) || 
       // Allow: Ctrl+X 
       (e.keyCode === 88 && (e.ctrlKey || e.metaKey)) || 
       // Allow: home, end, left, right 
       (e.keyCode >= 35 && e.keyCode <= 39)) { 
       // let it happen, don't do anything 
       return; 
      } 
      // Ensure that it is a number and stop the keypress 
      if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) { 
       e.preventDefault(); 
      } 
     } 
    } 
} 

（stackoverflowのサイトから参照） 0

app.directive('test',function(){ 
return{ 
    require:'ngModel', 
    restrict :'A', 
    link:function(scope,elm,attr,ngmodelctrl){ 
    ngmodelctrl.$parsers.push(function(val){ 
    // var clean=val.replace(/^(0*)/,''); 
    //var clean =val.replace(/[^0-9\.]/g,'') 
    var clean =val.replace(/[^a-zA-Z\.]/g,'') 
    ngmodelctrl.$setViewValue(clean); 
    ngmodelctrl.$render(); 
    }); 
    } 
} 

}) 

あなたは数値またはテキストのみを受け入れるように入力を検証する必要がある場合、私はテキストのみと別のを許可する2つのディレクティブは数字だけ

Answer 1

を受け入れるようにしたい、あなたは角度の検証を使用する必要がありますし、実際にあなたを構築する必要があります独自の検証。 良い例がここにあります。

https://blog.thoughtram.io/angular/2016/03/14/custom-validators-in-angular-2.html

しかし、あなたはテキストのみを入力するようユーザーに強制する必要がある場合は、キーを聞き、その後、入力のイベントを変更するには、入力された値が要件に一致していません一度あなたが書く必要がありますする必要があります。

e.preventDefault(); 
return false;