【发布时间】:2017-09-29 11:37:35
【问题描述】:
我正在尝试为英国国家/地区创建一个带有 optgroup 的选择,每个国家/地区都包括一个可以选择的县列表。
我正在尝试使用带有 Angular 的 ng-repeat 来访问数据,我可以为选择中的单级数组执行此操作,但我不确定我是否已正确设置我的县数组这样做,这些县显然没有显示在列表中。
JSFiddle:https://jsfiddle.net/ehtxcwtk/1/.
HTML:
<select data-ng-model="address.county" id="countySelect" material-select watch name="countySelect" class="validate">
<option value="" selected>Select an option</option>
<optgroup label="England">
<option data-ng-repeat="county in counties.england">{{county.name}}</option>
</optgroup>
<optgroup label="Scotland">
<option data-ng-repeat="county in counties.scotland">{{county.name}}</option>
</optgroup>
<optgroup label="Wales">
<option data-ng-repeat="county in counties.wales">{{county.name}}</option>
</optgroup>
<optgroup label="Northern Ireland">
<option data-ng-repeat="county in counties.northernIreland">{{county.name}}</option>
</optgroup>
</select>
-
数组:
var counties = [
{
england: [
{
name: 'Bath and North East Somerset'
},
{
name: 'Bedfordshire'
},
{
name: 'Berkshire'
},
{
name: 'Bristol'
},
{
name: 'Buckinghamshire'
},
{
name: 'Cambridgeshire'
},
{
name: 'Cheshire'
},
{
name: 'Cornwall'
},
{
name: 'County Durham'
},
{
name: 'Cumbria'
},
{
name: 'Derbyshire'
},
{
name: 'Devon'
},
{
name: 'Dorset'
},
{
name: 'East Riding of Yorkshire'
},
{
name: 'East Sussex'
},
{
name: 'Gloucestershire'
},
{
name: 'Greater London'
},
{
name: 'Greater Manchester'
},
{
name: 'Hampshire'
},
{
name: 'Herefordshire'
},
{
name: 'Hertfordshire'
},
{
name: 'Isle of Wight'
},
{
name: 'Isles of Scilly'
},
{
name: 'Kent'
},
{
name: 'Lancashire'
},
{
name: 'Leicestershire'
},
{
name: 'Lincolnshire'
},
{
name: 'Merseyside'
},
{
name: 'Norfolk'
},
{
name: 'North Somerset'
},
{
name: 'North Yorkshire'
},
{
name: 'Northamptonshire'
},
{
name: 'Northumberland'
},
{
name: 'Nottinghamshire'
},
{
name: 'Oxfordshire'
},
{
name: 'Rutland'
},
{
name: 'Shropshire'
},
{
name: 'Somerset'
},
{
name: 'South Gloucestershire'
},
{
name: 'South Yorkshire'
},
{
name: 'Staffordshire'
},
{
name: 'Suffolk'
},
{
name: 'Surrey'
},
{
name: 'Tyne and Wear'
},
{
name: 'Warwickshire'
},
{
name: 'West Midlands'
},
{
name: 'West Sussex'
},
{
name: 'West Yorkshire'
},
{
name: 'Wiltshire'
},
{
name: 'Worcestershire'
}
]
},
{
scotland: [
{
name: 'Aberdeenshire'
},
{
name: 'Angus'
},
{
name: 'Argyll and Bute'
},
{
name: 'Ayrshire'
},
{
name: 'Banffshire'
},
{
name: 'Berwickshire'
},
{
name: 'Borders'
},
{
name: 'Caithness'
},
{
name: 'Clackmannanshire'
},
{
name: 'Dumfries and Galloway'
},
{
name: 'Dunbartonshire'
},
{
name: 'East Ayrshire'
},
{
name: 'East Dunbartonshire'
},
{
name: 'East Lothian'
},
{
name: 'East Renfrewshire'
},
{
name: 'Fife'
},
{
name: 'Highland'
},
{
name: 'Inverclyde'
},
{
name: 'Kincardineshire'
},
{
name: 'Lanarkshire'
},
{
name: 'Midlothian'
},
{
name: 'Moray'
},
{
name: 'North Ayrshire'
},
{
name: 'North Lanarkshire'
},
{
name: 'Orkney'
},
{
name: 'Perth and Kinross'
},
{
name: 'Renfrewshire'
},
{
name: 'Shetland'
},
{
name: 'South Ayrshire'
},
{
name: 'South Lanarkshire'
},
{
name: 'Stirlingshire'
},
{
name: 'West Dunbartonshire'
},
{
name: 'West Lothian'
},
{
name: 'Western Isles'
}
]
},
{
wales: [
{
name: 'Blaenau Gwent'
},
{
name: 'Bridgend'
},
{
name: 'Caerphilly'
},
{
name: 'Cardiff'
},
{
name: 'Carmarthenshire'
},
{
name: 'Ceredigion'
},
{
name: 'Conwy'
},
{
name: 'Denbighshire'
},
{
name: 'Isle of Anglesey'
},
{
name: 'Merthyr Tydfil'
},
{
name: 'Monmouthshire'
},
{
name: 'Neath Port Talbot'
},
{
name: 'Newport'
},
{
name: 'Pembrokeshire'
},
{
name: 'Powys'
},
{
name: 'Rhundda Cynon Taff'
},
{
name: 'Swansea'
},
{
name: 'Torfaen'
},
{
name: 'Vale of Glamorgan'
},
{
name: 'Wrexham'
}
],
},
{
scotland: [
{
name: 'Antrim'
},
{
name: 'Armagh'
},
{
name: 'Down'
},
{
name: 'Fermanagh'
},
{
name: 'Londonderry'
},
{
name: 'Tyrone'
},
]
}
];
【问题讨论】:
标签: javascript angularjs arrays json