與AngularJS和選擇綁定的問題不加載默認值

我有一個<select>輸入和綁定與AngluarJS的問題。我在Plunker上創建了一個最低工作示例：http://plnkr.co/edit/P4T25RoJrU4mvbBiUJ9S?p=preview。與AngularJS和選擇綁定的問題不加載默認值

基本問題如下：下拉菜單中的值不會從我的模型中預選。

此外，在Angular 1.1.5中，ng-options似乎在生成的<option>標籤中不包含「標籤」，因此當您更改選擇時，下拉控件不會記錄任何更改。

來源

2016-03-01 Nate

如果「通過option.id軌道」，從NG選項去掉，應該預先選擇基於模型。我有修改Plunker：http://plnkr.co/edit/b4ddyA5Q4jGNcJI1d8eW?p=preview –

是的，我試過了，我什麼也沒有... – TomSlick

@VivekN這似乎已經解決了我的問題。非常感謝你。發佈這個答案，我可以接受它。 – Nate

兩個問題：

比較字符串爲字符串
在同一個表達式中使用select as和track by時要小心。

angular.module('defaultValueSelect', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
    $scope.data = { 
    availableOptions: [ 
     {id: '1', name: 'Option A'}, 
     {id: '2', name: 'Option B'}, 
     {id: '3', name: 'Option C'} 
    ], 
    //USE this 
    selectedOption: '2' 
    //NOT this 
    //selectedOption: 2 //This sets the default value 
    }; 
}]);

HTML

<!-- remove 'track by option.id' --> 

<select name="mySelect" id="mySelect" 
    ng-options="option.id as option.name for option 
       in data.availableOptions track by option.id" 
    ng-model="data.selectedOption"> 
</select>

從文檔：

在同一個表達式中使用select as和track by時要小心。

這將工作：
<select 
    ng-options="item as item.label for item in items track by item.id" 
    ng-model="selected"> 
</select> 
，但是這是行不通的：
<select 
    ng-options="item.subItem as item.label for item in items track by item.id" 
    ng-model="selected"> 
</select> 

- AngularJS ng-options Directive API Reference

來源

2016-03-01 23:32:33 georgeawg

按照要求通過OP，將作爲答案的評論。

如果您從ng選項中刪除「track by option.id」如下，它應該根據您的模型進行預先選擇。

<select name="mySelect" id="mySelect" 
     ng-options="option.id as option.name for option in data.availableOptions" 
     ng-model="data.selectedOption"></select>

退房修改Plunker：http://plnkr.co/edit/b4ddyA5Q4jGNcJI1d8eW?p=preview

來源

2016-03-02 00:36:42

與AngularJS和選擇綁定的問題不加載默認值

回答

相關問題