Angular 7 ngx-intl-tel-input onBlur() 事件有什么解决办法吗？

Question

我在 Angular 7 中使用 ngx-intl-tel-input 包遇到了一个问题。我只想在 blur 上查看电话号码。

   <ngx-intl-tel-input [cssClass]="'form-control'" [preferredCountries]="preferredCountries"
        [enableAutoCountrySelect]="false" [enablePlaceholder]="true" [searchCountryFlag]="true"
        [searchCountryField]="[SearchCountryField.Iso2, SearchCountryField.Name]" [selectFirstCountry]="false"
        [selectedCountryISO]="CountryISO.Canada" [maxLength]="15" [tooltipField]="TooltipLabel.Name"
        [phoneValidation]="true" name="PhoneNumber" [(ngModel)]="formModel.PhoneNumber" #PhoneNumber="ngModel">
      </ngx-intl-tel-input>

Answer 1

Angular Forms API 有 updateOn 选项，你可以用它来触发 ngModelChange on blur

component.html

    <ngx-intl-tel-input [cssClass]="'form-control'" [preferredCountries]="preferredCountries"
            [enableAutoCountrySelect]="false" [enablePlaceholder]="true" [searchCountryFlag]="true"
            (ngModelChange)="ngModelChange($event)"
            [searchCountryField]="[SearchCountryField.Iso2, SearchCountryField.Name]" [selectFirstCountry]="false"
            [selectedCountryISO]="CountryISO.Canada" [maxLength]="15" [tooltipField]="TooltipLabel.Name"
            [ngModelOptions]="{updateOn: 'blur'}"
            [phoneValidation]="true" name="PhoneNumber" [(ngModel)]="formModel.PhoneNumber" #PhoneNumber="ngModel">
     </ngx-intl-tel-input>

component.ts

 onChange(event){
    console.log(event);
  }

Example

Angular 7 ngx-intl-tel-input onBlur() 事件有什么解决办法吗？

Angular 7 ngx-intl-tel-input onBlur() event any solution?

onblur

angular

angular7