Cascading DropDown List in AngularJS

This code tells about how to create a cascading drop down list in AngularJs based on selection of first drop down the 2nd dropdown will fill up .

<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
<script>
angular.module("app", [])
.controller("myCtrl",function($scope){
$scope.County = [
{ CountyName: 'India', countyNumber: '01' },
{ CountyName: 'US', countyNumber: '02' },
{ CountyName: 'UK', countyNumber: '03' }
];
$scope.Municipality = [
{ MunicipalityName: 'Mumbai', MunicipalityNumber: '01' },
{ MunicipalityName: 'Newyork', MunicipalityNumber: '02' },
{ MunicipalityName: 'London', MunicipalityNumber: '03' }
];
$scope.featuretype = [
{ type: 'County', data:$scope.County, displayName:'CountyName' },
{ type: 'Municipality', data:$scope.Municipality, displayName:'MunicipalityName'}
];
});
</script>
</head>
<body>
<div ng-app="app">
<div ng-controller="myCtrl">
Select a Country or Municipality:
<select id="FeatureTypeDropdown" ng-model="option1" ng-options="ft as ft.type for ft in featuretype">
<option value="">Select</option>
</select>
<select id="Select1" ng-model="county" ng-options="c as c[option1.displayName] for c in option1.data">
<option value="">Select</option>
</select>
</div>
</div>
</body>
</html>

Output: AS soon as we select from the first dropdown (Select a Country or Municipality:) the country names or Municipality name will be populated in the second dropdown.