webcat12345 / ngx-intl-tel-input

Phone number input field to support international numbers, Angular
MIT License
213 stars 339 forks source link

How to set country flag and code using country dial code #395

Open sunil-todkar opened 3 years ago

sunil-todkar commented 3 years ago

I am not able to set the country code and flag using dial code. Could you please provide me a solution to the above issue?

image

1992maitri commented 3 years ago

Hello, I was facing same issue. But I have tried to set selectedCountryIso.

[selectedCountryISO]="US"

By this default default will be as 'US'. Now for example, if you are changing the selected country to India, in code behind you can get the country code as phoneNumber['countryCode'].

So, the code will be , (for angular)

[selectedCountryISO]="countryCode" (in html) this.countryCode = pNumber['countryCode'] (in typescript)

I hope this can help you

sunil-todkar commented 3 years ago

Hi,

I am getting dial code from the backend . So could you please explain how to set a country using dial code like for India its +91.

On Tue, Aug 10, 2021 at 4:55 PM 1992maitri @.***> wrote:

Hello, I was facing same issue. But I have tried to set selectedCountryIso.

[selectedCountryISO]="US"

By this default default will be as 'US'. Now for example, if you are changing the selected country to India, in code behind you can get the country code as phoneNumber['countryCode'].

So, the code will be , (for angular)

[selectedCountryISO]="countryCode" (in html) this.countryCode = pNumber['countryCode'] (in typescript)

I hope this can help you

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/webcat12345/ngx-intl-tel-input/issues/395#issuecomment-895949609, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANGP24IEWR5UMRVMQY42J63T4EEDDANCNFSM5BGQ7LPQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&utm_campaign=notification-email .

evandersar commented 2 years ago

My solution is setting

[enableAutoCountrySelect]="true"

then init form control with whole number (code + number)

this.form = this.fb.group({ phone: code +number, });

after that in AfterViewInit hook set only number value to control

ngAfterViewInit() { setTimeout(() => this.form.get('phone')?.setValue(number)); }

Examples of code = '+380', number = '441234567'