如何使用 Angular 自动格式化电话号码答案

【问题标题】：How to auto-format phone number using Angular如何使用 Angular 自动格式化电话号码
【发布时间】：2020-03-01 18:32:59
【问题描述】：

在 Angular 中，我将手机号码设置为 (888)8888-888 并写入 maxlength 为 13 和 keypress 事件，用于自动格式化模式以自动按下括号和破折号，但在移动设备中自动格式化不起作用：它需要 13 个号码作为手机号码.

<ion-label stacked>MOBILE (OPTIONAL)</ion-label>
<ion-input name="mobile1" placeholder="(888)888-8888" maxlength="13" class="hoverBorder"
   (keypress)="checkMobileLength($event.target.value,'buyer')" type="text" formControlName="mobile1"
   [class.invalid]="!signupBuyer.controls.mobile1.valid && (signupBuyer.controls.mobile1.dirty || submitAttempt)">
</ion-input>

checkMobileLength(val, data) {
   if (data == 'buyer') {
      if (val.length == 3) {
         this.signupBuyer.controls.mobile1.setValue('(' + val + ')')
      } if (val.length == 8) {
         this.signupBuyer.controls.mobile1.setValue(val + '-')
      }
   } else if (data == 'agent') {
      if (val.length == 3) {
         this.signup1.controls.mobile1.setValue('(' + val + ')')
      } if (val.length == 8) {
         this.signup1.controls.mobile1.setValue(val + '-')
      }
   }
}

【问题讨论】：

您好 Urmila，请添加一个更好的解释，说明您的代码应该做什么以及您为尝试解决问题所采取的步骤！欢迎来到 SO！
我添加了一些标点符号并稍微改变了语言，希望不会改变问题的含义。

标签： javascript html css ionic-framework angular6

【解决方案1】：

尝试使用 (ionChange) 而不是 (keypress)

【讨论】：