与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和选择绑定的问题不加载默认值

回答

相关问题