Angularjs依赖州 - >城市下拉，从http.get服务检索城市

Question

我正在寻找一种方法来使用http.get服务从它们所属的联邦状态中检索城市。我从一个选定的州创建了一个依赖城市的下拉菜单。

这里是工作提琴作为一个基地，一个DINAMIC版本：

http://jsfiddle.net/amrigo/v8u7v4af/

我的意思是有州和城市：

function CountryController($scope) { 
       $scope.countries = { 
        'Michigan': { 
         'Detroit': [], 
         'Flint': [] 
        }, 
        'Texas': { 
         'Austin': [], 
         'Houston': [] 
        }, 
        'California': { 
         'Los Angeles': [], 
         'San Francisco': [] 
        } 

       }; 
      } 

我怎么能写一个工厂，接收状态ID并调整为JSON格式：（'Los Angeles'：[]，'San Francisco'：[]）。

.factory('citiesByState', function($http) { 
    return { 
     getVersion: function(id) { 
      return $http.get('http://www.service.com/ckeck_cities.php') 
          .then(function(response) { 
           return response.data; 
      }); 
     } 
    }; 
}); 


<select class="form-control input-lg" id="country" ng-model="states" ng-options="country for (country, states) in countries"> 
    <option value=''>Select</option> 
</select> 

<select class="form-control input-lg" id="state" ng-disabled="!states" ng-model="cities" ng-options="state for (state,city) in states"> 
    <option value=''>Select</option> 
</select> 

Answer 1

工厂将按给定状态提取城市并将其保存在州 - >城市地图中。

.factory('citiesByState', function($http) { 
    return { 
     locationData: {}, 
     getCities: function(id) { 
      var that = this; 
      return $http.get('http://www.service.com/ckeck_cities.php?state='+id) 
          .then(function(response) { 
           that.locationData[id] = response.data; 
      }); 
     } 
    }; 
}); 

你再注入的服务为您的控制器和使用国有>城市地图更新您的UI。

function CountryController($scope, $citiesByState) { 
     $citiesByState.getCities(1); // pass your state id 
     $scope.cities = $citiesByState.locationData; //cities will contain your data for the given state when the response is received 
}