【问题标题】:How do I set initial value for ngx-intl-tel-input如何为 ngx-intl-tel-input 设置初始值
【发布时间】:2019-08-22 09:26:27
【问题描述】:
我在我的 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] 属性,但它似乎不起作用。
【问题讨论】:
标签:
angular
intl-tel-input
【解决方案1】:
在 ngAfterViewInit 中,将带有国家代码的电话值修补到表单控件并检测更改。
ngAfterViewInit(){
this.phoneForm.controls.phone.setValue('+919898989898');
this.cd.detectChanges();
}
【解决方案2】:
当你使用表单控件时,最简单的方法是设置控件的初始值。
对于 ngx-intl-tel-input,您的电话号码必须包含国家/地区代码。
this.yourFormGroup= this.formBuilder.group({
phone: ['+918888888888', [Validators.required]],
});