Angular:
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<div ng:app="MyApp">
<div ng:controller="CtrlA">
<select ng:options="l.name for l in list"
ng:model="selection">
<option value=""></option>
</select>
<select ng:options="l.name for l in myValues"
ng:model="selection2">
<option value=""></option>
</select>
Selection: {{selection.name}}
</div>
</div>
JavaScript
var appModule = angular.module('MyApp', []);
appModule
.value('MySelection', {name: ''})
.value('MyList',[{name:'test1'},{name:'test2'}])
.value('MyOtherList',[
{name:'test1', values:[{name:'a'},{name:'b'}]},
{name:'test2', values:[{name:'c'},{name:'d'}]}
]);
function CtrlA(filterFilter, MySelection, MyList, MyOtherList) {
var self = this;
self.list = MyList;
self.otherList = MyOtherList;
self.selection = MySelection;
self.myValues = filterFilter(self.otherList,
{name:'test1'}).values;
self.$watch('selection.name', function() {
if (self.selection.name != '') {
var x = filterFilter(self.otherList,self.selection);
alert(angular.toJson(self.selection));
self.myValues = x[0].values;
}
});
}