javascript - 乘以下拉AngularJS

Question

在我的网络应用程序上，我需要有多个下拉框。所有数据均来 self 的 api 的 json。好吧，我的问题是，我知道如何从 api 设置数据，但这里我有 3 个不同的 url，第一个是国家/地区，第二个是州，第三个是城市。下拉列表取决于所选国家/地区。在第一个下拉列表中，我需要选择县(网址:blabla/countries)，然后在第二个下拉列表中，我需要为所选国家/地区设置州(网址:blabla/countries/countryId/states)，在第三个下拉列表中，我只需要选择城市选定的州(网址:blabla/countries/countryId/states/statesId/city)。我不知道如何将所选国家/地区的 ID 添加到下一个下拉框的 URL。

 $http.get('url')
                .success(function(response)
        {$scope.countryes=response;});
    

  <div>
        Country: 
        <select id="country" ng-model="country" ng-options="country.id as country.name for country in countryes">
          <option value=''>{{countryes.name}}</option>
        </select>
    </div>
    <div>
        States <select id="city" ng-disabled="!country" ng-model="suburbs" ng-options="state as state.name for state in states"><option value='state'>Select</option></select>
    </div>
    <div>
        City <select id="suburb" ng-disabled="!suburbs" ng-model="suburb" ng-options="suburb for suburb in suburbs"><option value=''>Select</option></select>        
    </div>

谢谢大家

Answer 1

使用 ng-change 进行县和州选择

   <div>
  Country:
  <select id="country" ng-model="country" ng-options="country.id as country.name for country in countryes" ng-change='getState()'>
    <option value=''>{{countryes.name}}</option>
  </select>
</div>
<div>
  States
  <select id="city" ng-disabled="!country" ng-model="suburbs" ng-options="state as state.name for state in states"  ng-change='getCity()'>
    <option value='state'>Select</option>
  </select>
</div>
<div>

在 Controller 中添加新功能

$scope.getState = function(){
    //this function run when you select country
     $http.get('getStateUrl',{country: $scope.country})

}


$scope.getCity= function(){
     //this function run when you select state
     $http.get('getCityUrl',{state: $scope.suburbs})
}