Question

我需要填写美国所有州的html选择选项。如果我能看到一个例子会很有帮助。我是否需要在范围变量中定义所有状态？

谢谢！

Answer 1

是的，最好的方法是将它作为范围变量存储在一个对象数组中，然后在模板中使用它。

像这样......

让我们说$ scope.allState []是美国所有州的对象数组。

然后在你的模板中尝试它....

length

Answer 2

完全没有，不需要在范围内单独定义所有状态。你可以在角度js中简单地使用$ watch服务。

please refer the jsfiddle link here:

状态和城市可以在一个对象数组中获取，数据-ng-options用于显示将从控制器加载的选项。 $ watch将关注状态的变化并相应地加载城市。

＆＃13;

function Controller($scope) {

    var states = [{
         "Name": "karnataka",
            "cities": [{
          
                "Name": "bangalore"
        }, {
         
                "Name": "mangalore"
        }, {
           
                "Name": "mysore"
        }]
    }, {
     
            "Name": "maharashtra",
            "cities": [{
           
                "Name": "Mumbai"
        }, {
           
                "Name": "pune"
        }, {
          
                "Name": "nagpur"
        }]
    }];

    $scope.groups = states;
    $scope.currentGroup = states[0];
    $scope.currentItems = $scope.currentGroup.cities;
    $scope.currentItem = $scope.currentItems[0];
    
    $scope.$watch('currentGroup', function () {
		        $scope.currentItems = $scope.currentGroup.cities;
		        $scope.currentItem = $scope.currentGroup.cities[0];
		    });	
    }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<section ng-app ng-controller="Controller">
	
    
        <div class="span4">
            <label for="cboGroup">States</label>
				<select data-ng-model="currentGroup" data-ng-options="group.Name for group in groups"></select>
        </div>
        <div class="span4">
            <label for="cboItem">Cities</label>
				<select data-ng-model="currentItem" data-ng-options="item.Name for item in currentItems"></select>
        </div>
   <div>
       Selected city :  {{currentItem.Name}}
   <div>
</section>

＆＃13;

如何在angularjs中填充html select元素选项？

2 个答案: