AngularJs - get value from ng-model (ng-option) - angularjs

Question

I'm creating a dependency dropdown from JSON(country, city). Based on country selection city will populate in second dropdown. If I get the value of country it return object with city list.
please wait to get country dropdown value from github raw.
var app = angular.module('myApp',[])
app.controller('dropdown', function($scope, $http){
$scope.istrue = true;
$scope.userInfo = [];
$http.get('https://raw.githubusercontent.com/David-Haim/CountriesToCitiesJSON/master/countriesToCities.json').then(function(response){
$scope.countriesToCities = response.data;
//console.log($scope.countriesToCities)
},function(response){
console.log(response.status);
});
$scope.populateCities = function() {
$scope.istrue = false;
//console.log($scope);
$scope.cityArray = $scope.users.country;
}
$scope.selectedCity = function(){
console.log($scope.city)
}
$scope.pushInArray = function() {
var user = angular.copy($scope.users);
$scope.userInfo.push(user);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="dropdown">
<input type="text" name="name" ng-model="users.name" placeholder="Name">
<input type="text" name="email" ng-model="users.email" placeholder="Email">
<input type="text" name="phoneNo" ng-model="users.phoneNo" placeholder="phone Number">
<select ng-model="users.country" ng-change='populateCities()' ng-options="x for (x, y) in countriesToCities"></select>
<select ng-hide="istrue" ng-model="users.city" ng-change='selectedCity()' ng-options="x for x in cityArray"></select>
<button ng-click="pushInArray()">Add</button>
<pre>{{userInfo}}</pre>
</div>
How to get the value of country?

Answer 1

Working snippet with modified $scope.populateCities(), $scope.user = {} object and ng-options to select correct country.
var app = angular.module('myApp',[])
app.controller('dropdown', function($scope, $http){
$scope.istrue = true;
$scope.userInfo = [];
$scope.user = {};
$http.get('https://raw.githubusercontent.com/David-Haim/CountriesToCitiesJSON/master/countriesToCities.json').then(function(response){
$scope.countriesToCities = response.data;
//console.log($scope.countriesToCities)
},function(response){
console.log(response.status);
});
$scope.populateCities = function() {
$scope.istrue = false;
angular.forEach($scope.countriesToCities, function(values, key) {
if($scope.user.country == key) {
$scope.cityArray = values;
}
});
}
$scope.pushInArray = function() {
var user = angular.copy($scope.user);
$scope.userInfo.push(user);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="dropdown">
<input type="text" name="name" ng-model="users.name" placeholder="Name">
<input type="text" name="name" ng-model="user.name" placeholder="Name">
<input type="text" name="email" ng-model="user.email" placeholder="Email">
<input type="text" name="phoneNo" ng-model="user.phoneNo" placeholder="phone Number">
<select ng-model="user.country" ng-change='populateCities()' ng-options="country as country for (country, cities) in countriesToCities"></select>
<select ng-hide="istrue" ng-model="user.city" ng-change='selectedCity()' ng-options="x for x in cityArray"></select>
<button ng-click="pushInArray()">Add</button>
<pre>{{userInfo}}</pre>
</div>