如何在angularjs中根据所选国家/地区获得州?

时间:2015-12-14 05:10:53

标签: javascript angularjs

我有这样的JSON数据。我有两个下拉列表:一个国家和一个州。根据选择的国家/地区,我想更新状态下拉列表。

$scope.countryOptions = [
        {
            'name': 'India',
            'value': 'india',
            'states': [
                {
                    'name': 'Arunachal Pradesh',
                    'value': 'arunachal-pradesh'
                },
                {
                    'name': 'Andhra Pradesh',
                    'value': 'andhra-pradesh'
                },
                {
                    'name': 'Assam',
                    'value': 'assam'
                },
            ]
        },
        {
            'name': 'United States',
            'value': 'united-states',
            'states': [
                {
                    'name': 'New York',
                    'value': 'new-york'
                },
                {
                    'name': 'Florida',
                    'value': 'florida'
                },
                {
                    'name': 'Massechussettes',
                    'value': 'massechussettes'
                },
            ]
        },
        {
            'name': 'Australia',
            'value': 'australia',
            'states': [
                {
                    'name': 'Victoria',
                    'value': 'victoria'
                },
                {
                    'name': 'Queensland',
                    'value': 'queensland'
                },
                {
                    'name': 'New South Wales',
                    'value': 'new-south-wales'
                },
            ]
        },
    ]

1 个答案:

答案 0 :(得分:0)

  <select ng-model="country" ng-change="update(country)" ng-options="option.value as option.name for option in countryOptions ">
     <option ng-disabled="true"   ng-selected="true" value="">Select a country</option>
  </select>
<br /> <br /> <br /> 

  <select ng-model="state" ng-options="item as item.name for item in countryOptions[index].states " >
      <option ng-disabled="true"  ng-selected="true" value="">Select a state</option>
  </select>


    $scope.update=function(index){
      for(var i=0;i<countryOptions.length;i++){
        if(countryOptions.name == index){
          $scope.index= index;
        }
      }
    };