fix(onPhoneNumberChange): handle cut

rbalet · Jun 19, 2024 · 69511f8 · 69511f8
1 parent 25428b3
commit 69511f8
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 27 deletions.
diff --git a/README.md b/README.md
@@ -143,5 +143,8 @@ In your project run:
 
 `$ npm install --save {{path to your local '*.tgz' package file}}`
 
-### Acknowledgments
-This repo is a fork from the [ngx-mat-intl-tel-input](https://github.com/tanansatpal/ngx-mat-intl-tel-input) library.
+## Authors and acknowledgment
+* maintainer [Raphaël Balet](https://github.com/rbalet) 
+* Forked from [ngx-mat-intl-tel-input](https://github.com/tanansatpal/ngx-mat-intl-tel-input)
+
+[![BuyMeACoffee](https://www.buymeacoffee.com/assets/img/custom_images/purple_img.png)](https://www.buymeacoffee.com/widness)
diff --git a/projects/ngx-mat-input-tel/README.md b/projects/ngx-mat-input-tel/README.md
@@ -143,5 +143,8 @@ In your project run:
 
 `$ npm install --save {{path to your local '*.tgz' package file}}`
 
-### Acknowledgments
-This repo is a fork from the [ngx-mat-intl-tel-input](https://github.com/tanansatpal/ngx-mat-intl-tel-input) library.
+## Authors and acknowledgment
+* maintainer [Raphaël Balet](https://github.com/rbalet) 
+* Forked from [ngx-mat-intl-tel-input](https://github.com/tanansatpal/ngx-mat-intl-tel-input)
+
+[![BuyMeACoffee](https://www.buymeacoffee.com/assets/img/custom_images/purple_img.png)](https://www.buymeacoffee.com/widness)
diff --git a/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts b/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts
@@ -281,32 +281,35 @@ export class NgxMatInputTelComponent
   }
 
   public onPhoneNumberChange(): void {
-    if (!this.phoneNumber) return
-
-    try {
-      this.numberInstance = parsePhoneNumberFromString(
-        this.phoneNumber.toString(),
-        this.selectedCountry.iso2.toUpperCase() as CC,
-      )
-      this.formatAsYouTypeIfEnabled()
-      this.value = this.numberInstance?.number
-      if (this.numberInstance && this.numberInstance.isValid()) {
-        if (this.phoneNumber !== this.formattedPhoneNumber) {
-          this.phoneNumber = this.formattedPhoneNumber
-        }
-        if (
-          this.selectedCountry.iso2 !== this.numberInstance.country &&
-          this.numberInstance.country
-        ) {
-          this.selectedCountry = this.getCountry(this.numberInstance.country)
-          this.countryChanged.emit(this.selectedCountry)
+    if (this.phoneNumber)
+      try {
+        this.numberInstance = parsePhoneNumberFromString(
+          this.phoneNumber.toString(),
+          this.selectedCountry.iso2.toUpperCase() as CC,
+        )
+        this.formatAsYouTypeIfEnabled()
+        this.value = this.numberInstance?.number
+        if (this.numberInstance && this.numberInstance.isValid()) {
+          if (this.phoneNumber !== this.formattedPhoneNumber) {
+            this.phoneNumber = this.formattedPhoneNumber
+          }
+          if (
+            this.selectedCountry.iso2 !== this.numberInstance.country &&
+            this.numberInstance.country
+          ) {
+            this.selectedCountry = this.getCountry(this.numberInstance.country)
+            this.countryChanged.emit(this.selectedCountry)
+          }
         }
+      } catch (e) {
+        // if no possible numbers are there,
+        // then the full number is passed so that validator could be triggered and proper error could be shown
+        this.value = this.phoneNumber.toString()
       }
-    } catch (e) {
-      // if no possible numbers are there,
-      // then the full number is passed so that validator could be triggered and proper error could be shown
-      this.value = this.phoneNumber.toString()
+    else {
+      this.value = null
     }
+
     this.propagateChange(this.value)
     this._changeDetectorRef.markForCheck()
   }