cascading dropdown angularjs ng-option object error

Question

i have used this example http://devzone.co.in/simple-example-of-dependable-dropdowns-cascading-dropdowns-using-angularjs/ here its working fine but my getting object with in

Answer 1

If you just want to get the selected country and state, can iterate over the object and check which key matches the value of ng-model. To get the city, you only have to return the value of ng-model.

angular.module('test', [])
  .controller('TestController', ['$scope',
      function($scope) {
        $scope.countries = {
          'India': {
            'Maharashtra': ['Pune', 'Mumbai', 'Nagpur', 'Akola'],
            'Madhya Pradesh': ['Indore', 'Bhopal', 'Jabalpur'],
            'Rajasthan': ['Jaipur', 'Ajmer', 'Jodhpur']
          },
          'USA': {
            'Alabama': ['Montgomery', 'Birmingham'],
            'California': ['Sacramento', 'Fremont'],
            'Illinois': ['Springfield', 'Chicago']
          },
          'Australia': {
            'New South Wales': ['Sydney'],
            'Victoria': ['Melbourne']
          }
        };

        $scope.getCountry = function(val) {
          for (var key in $scope.countries) {
            if ($scope.countries.hasOwnProperty(key)) {
              if ($scope.countries[key] === val) {
                alert('You selected: ' + key);
              }
            }
          }
        };
        
        $scope.getCity = function(city, state) {
          for (var key in state) {
            if (state.hasOwnProperty(key)) {
              if (state[key] === city) {
                alert('You selected: ' + key);
              }
            }
          }
        };

        $scope.alertCity = function(city) {
          alert('You selected ' + city);
        };
  }]);

  

    

      Country:
      
        Select
      
    
    

      States:
      
        Select
      
    
    

      City:
      
        Select
        {{city}}