1 year ago

#358013

test-img

ace Garcia

Auto populate address

Good day guys I am trying to auto populate an address using postal code of Japan I use AjaxZip3.addr2 that I got online and it works fine in VueJS . it also populates the field in angular, however it did not bind to the ngModel that I assigned, also I tried to console.log the value and it is null, even though, there is data in the field.

<div class="item-wrapper">            
            <label>Postal Code</label> <input type="text" name="zip" placeholder="1010065"  
formControlName="postal_code" 
onkeydown="AjaxZip3.zip2addr(this,'','prefectual','city','address1');" 
(change)="showAddress($event)">
        </div>
        <p>Please enter the address without symbols. Enter your zip code and your address will 
be automatically entered.</p>
        
        <div class="item-wrapper">            
            <label>Pref</label> <input [(ngModel)]="prefShow" name="prefectual" type="text" 
placeholder="東京都"  formControlName="prefectual">
        </div>
        <div class="item-wrapper">            
            <label>City</label> <input [(ngModel)]="cityShow" name="city" type="text" 
placeholder="千代田区"  formControlName="city">
        </div>
        <div class="item-wrapper">            
            <label>Town</label> <input [(ngModel)]="townShow" name="address1" type="text" 
placeholder="西神田1-3-6 URTAKE Build.3F" formControlName="address1">
        </div>

onkeydown is the inline function that triggers the auto complete , the parameters inside
are the input field that will auto populate once the postal code is correct .

I just add the script in my index.html file

<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"> 

for the auto populate to work

Is there anyway I can get the return value of this so i can use it in my ts file ?

AjaxZip3.zip2addr(this,'','prefectual','city','address1');

If none , Is there any other approach on how to do this ?

Thanks

angular

auto-populate

0 Answers

Your Answer

Accepted video resources