使用 angular js 根据第一个选择的选项过滤第二个选择框
filter the second selectbox based on the first selected option using angular js
我有 2 个 select 框,它们使用 ng-options 和硬编码获取数据。
第二个 select 框应根据第一个 select 框中的 selected 数据显示数据。这是 plunker。
https://plnkr.co/edit/r1S1e61H3RfH3uYGYTBP?p=preview
谁能帮帮我。
$scope.data = [{
cities: [{
id: 1,
title: 'Mysore'
}, {
id: 2,
title: 'Bangalore'
}, {
id: 3,
title: 'Delhi'
}, {
id: 4,
title: 'Mumbai'
}],
maps: [{
id: 1,
title: 'Zoo',
city_id: 1
}, {
id: 2,
title: 'Palace',
city_id: 1
}, {
id: 3,
title: 'Beach',
city_id: 4
}]
}];
您可以将所选城市的 ID 作为过滤器从第一个下拉列表传递到第二个下拉列表,如下所示
<select name="mapSelect" required="true" ng-options="map as map.title for map in data[0].maps | filter:{'city_id':citySelect.selectedOption.id}" ng-model="mapSelect.selectedOption"></select>
我有 2 个 select 框,它们使用 ng-options 和硬编码获取数据。
第二个 select 框应根据第一个 select 框中的 selected 数据显示数据。这是 plunker。
https://plnkr.co/edit/r1S1e61H3RfH3uYGYTBP?p=preview
谁能帮帮我。
$scope.data = [{
cities: [{
id: 1,
title: 'Mysore'
}, {
id: 2,
title: 'Bangalore'
}, {
id: 3,
title: 'Delhi'
}, {
id: 4,
title: 'Mumbai'
}],
maps: [{
id: 1,
title: 'Zoo',
city_id: 1
}, {
id: 2,
title: 'Palace',
city_id: 1
}, {
id: 3,
title: 'Beach',
city_id: 4
}]
}];
您可以将所选城市的 ID 作为过滤器从第一个下拉列表传递到第二个下拉列表,如下所示
<select name="mapSelect" required="true" ng-options="map as map.title for map in data[0].maps | filter:{'city_id':citySelect.selectedOption.id}" ng-model="mapSelect.selectedOption"></select>