アンギュラ - 通常我々は別の選択ボックスで、ドロップダウンリストをカスケード接続しない単一のSELECTボックス

Question

のドロップダウン動作をカスケード。下の画像のように。

私の要件はかなり異なります。私はだけを追加したいです。単一選択ボックスこれは、カスケード動作として動作します。

Simple Example process : (yourSelectBox - name of Select Box) 
1) At First Instance It will show countries name in yourSelectBox 
2) lets say , If you select/click India as Coutry, 
3) now yourSelectBox should have States List like Maharashtra, Gujrat etc 
4) If you select Maharashtra as your state, 
5) how yourSelectBox should have City List. 
6) finally you select your city. 
Refer below image.

我々のイベントに目を保つことによってyourSelectBoxのフラッシュ値は、（選択した値に見$を使用）することはできますか？

Answer 1

HTML

<select ng-mode="selcountry" ng-change="getStates();"> 
<option value="coutry.id" ng-repeat="coutry in countries"> {{coutry.name}}</option> 
</select> 

<select ng-mode="selstate" ng-change="getCities();"> 
<option value="state.id" ng-repeat="state in states"> {{state.name}}</option> 
</select> 


<select ng-mode="selcity" > 
<option value="city.id" ng-repeat="city in cities"> {{city.name}}</option> 
</select> 

コントローラー：

$scope.getStates = function(){ 
//$scope.selcountry 
//call get states where counties is $scope.selcountry 
} 

$scope.getStates = function(){ 
//$scope.selcountry 
//call get states where counties is $scope.selcountry 
$scope.states= result //set states to 
} 

$scope.getCities = function(){ 
//$scope.selstate 
//call get states where counties is $scope.selstate 
$scope.cities = result //set cities to 
} 

したい場合は、単一選択メニューの完全なログイン：

<select> 
    <optgroup label="India"> 
    <optgroup label="Gujarat"> 
     <option value="1">Gandhi Nagar</option> 
     <option value="2">Porubandar</option> 
    </optgroup> 
    <optgroup label="Delhi"> 
     <option value="3">Delhi-6</option> 
     <option value="4">city</option> 
    </optgroup> 
    </optgroup> 
</select> 

Refer