試試這個
<select
name="name"
id="id"
ng-options="option.name for option in v.data track by option.value"
ng-model="v.selected"
class="form-control inline-forms">
<option value="" selected>{{placeHolder}}</option>
</select>
,並在控制器
$scope.v = {data:[], selected:{}, placeHolder:""}
$scope.v.data = [{name:"nameOne", value:"valueOne"},{name:"nameTwo", value:"valueTwo"},{name:"nameThree", value:"valueThree"}]
$scope.v.selected = $scope.v.data[0]
$scope.v.placeHolder = "Click to Select"
根據角文檔ngOption是更好的方式去比ngRepeat: ngRepeat和ngOptions 之間進行選擇在許多情況下,ngRepeat可以使用元素而不是ngOptions來實現類似的結果。然而,ngOptions提供了一些好處:
更大的靈活性在怎樣的模型是由不創建用於每個重複實例 新範圍經由選擇指定爲理解表達 減少內存消耗的部分增加渲染速度通過創建文檔片段中的選項而不是單獨使用 具體而言,從Chrome和Internet Explorer/Edge中的2000個選項開始,重複選項的選擇會顯着減慢。 參見:https://docs.angularjs.org/api/ng/directive/select
它適用於ng選項,但不適用於ng-repeat,我使用ng-repeat從00:00到23:00生成日時間列表,我的選擇值來自db,我賦值v.T_Hour =「db中的數值」在我的控制器中,但不起作用 –
你可以創建一個plunker來查看真實案例。 –