自動的にハイフン（ - ）をテキストフィールド内に入力するときに10桁の電話番号の間に追加します

Question

テキストフィールドの中に入力中に10桁の電話番号の間にハイフン（ - ）を自動的に追加しようとしています。北米規格。 結果はこのようになります。647-364-3975

私はtyprscriptでkepupイベントを使ってこれをしようとしています。 これは、すべての電話番号を入力し終わったときにハイフン（ - ）が追加されたことです。

<input id="PhoneNumberInputField" 
    (keyup)="_phoneNumberInputKeyUp($event)" [(ngModel)]="sharedVariables.PhoneNumberInput" maxlength="10" /> 


    _phoneNumberInputKeyUp(event : any) 
    { 
     var value = this.sharedVariables.PhoneNumberInput 

     if(value.length > 0){ 
     var formatted = value.replace(/^(\d{3})(\d{3})(\d{4}).*/,"$1-$2-$3"); 
     this.sharedVariables.PhoneNumberInput = formatted; 
    } 

} 

Answer 1

あなたはtext-maskを使用することができます。あなたのプロジェクトのあらゆる種類のマスキングを処理する素晴らしいライブラリです。

は、彼らは、一例として、米国電話番号マスクを有する：Dを

mask = ['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/]