先定義一些數(shù)據(jù)以便說明問題
function selectCtrl($scope) {
$scope.selected = '';
$scope.model = [{
id: 10001,
mainCategory: '男',
productName: '水洗T恤',
productColor: '白'
}, {
id: 10002,
mainCategory: '女',
productName: '圓領(lǐng)短袖',
productColor: '黑'
}, {
id: 10003,
mainCategory: '女',
productName: '短袖短袖',
productColor: '黃'
}];
1爪膊、基本用法
<select ng-model="selected"
ng-options="m.productName for m in model">
<option value="">-- 請選擇 --</option>
</select>
2、拼接屬性值痪蝇，讓選項看上去更生動
<select ng-model="selected"
ng-options="(m.productColor + ' - ' + m.productName) for m in model">
<option value="">-- 請選擇 --</option>
</select>
3攻旦、分組顯示選項喻旷，更直觀
<select ng-model="selected"
ng-options="(m.productColor + ' - ' + m.productName) group by m.mainCategory for m in model">
<option value="">-- 請選擇 --</option>
</select>
4、用 as 來定義綁定selected的具體值（前三種綁定的model中的一條記錄牢屋，這里selected綁定的是id）
<select ng-model="selected"
ng-options="m.id as m.productName for m in model">
<option value="">-- 請選擇 --</option>
</select>
