如何设置ngx-intl-tel-input的初始值

Question

我在Angular项目中使用ngx-intl-tel-input进行电话号码验证。

<form #f="ngForm" [formGroup]="phoneForm">
<ngx-intl-tel-input 
[cssClass]="'custom'" 
[preferredCountries]="['us', 'gb']" 
[enablePlaceholder]="true"
[enableAutoCountrySelect]="true"
[value]="'+91 8888888888'"
name="phone" 
formControlName="phone"></ngx-intl-tel-input>

我需要为来自服务器的字段设置值。

我使用了[value]属性，但似乎不起作用。

Answer 1

在ngAfterViewInit中，将带有国家/地区代码的电话的值修补到表单控件并检测更改。

ngAfterViewInit(){ this.phoneForm.controls.phone.setValue('+919898989898'); this.cd.detectChanges(); }

Answer 2

使用表单控件时，最简单的方法是设置控件的初始值。

对于 ngx-intl-tel-input 很重要，您的电话号码必须包含国家/地区代码。

 this.yourFormGroup= this.formBuilder.group({
          phone: ['+918888888888', [Validators.required]],
        });