Get key from the ng-option angularjs

Question

I am really new to ionic and was trying to implement drop-down for countries in my register page of application i am able to show data in my drop-down from response but i am not able to get its key value upon selection of item.

Here is my json response which i am displaying under my drop-down:

{
    AD: "Andorra",
    AE: "United Arab Emirates",
    AF: "Afghanistan",
    AG: "Antigua and Barbuda",
    AI: "Anguilla",
    AL: "Albania",
    AM: "Armenia",
    AN: "Netherlands Antilles",
    AO: "Angola",
    AQ: "Antarctica",
    AR: "Argentina"
}

The api response in i am saving like:

$scope.results = response.data;

And here is the way i am displaying it inside my drop-down:

<select class="input-select" >
    <option value="" disabled selected hidden>Country</option>
    <option ng-change="selectedCountry()" ng-repeat="(key, value) in results"  ng-model="country" value="{{key}}">{{value}}</option>
</select>

I am simply trying to get key of country selected by user by using function

ng-change="selectedCountry()" 

In my Html. But this function is not getting called.

Any help will be appreciated Thanks.

Answer 1

You need to use ngOptions directive as well as ngModel on select:

<select class="input-select" 
        ng-model="country"
        ng-change="selectedCountry()"
        ng-options="key as value for (key, value) in results">
    <option value="" disabled hidden>Country</option>
</select>