角度默认选择选项

我有一个问题让我的选择正确设置我的数据的默认选项。我通过Ajax调用从服务器获取数据。然后我希望能够使用表单编辑这些数据。我想指出选择使用在控制器对象中设置的选项，但是当您编辑select时，我希望模型指向ajax数据，因为这是我写回服务器的内容。正如你可以在我的plunkr中看到的那样，这四个项目中的每一个都应该有他们的选择选项，但是所有的选项都是空的。角度默认选择选项

在对角的官方文档，他们说做如下设置默认：

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'} 
    ], 
    selectedOption: {id: '3', name: 'Option C'} //This sets the default value of the select in the ui 
    }; 
}]); 

//Then in the HTML file: 
<select name="mySelect" id="mySelect" 
    ng-options="option.name for option in data.availableOptions track by option.id" 
    ng-model="data.selectedOption"></select>

在我的情况下，选择不在AJAX数据然而，只有当前选定的选项。所以我想通过一个控制器对象来管理可用选项，但将select与ajax数据绑定。谢谢。

https://plnkr.co/edit/Q16QLT?p=preview

来源

2016-06-07 Nathan Kamenar

您应该定义，其中 “选项” 属性，你要绑定到：

<select ng-options="option.value as option.text for option in options" ng-model="item.select"></select>

工作演示https://plnkr.co/edit/BezGaYjykfQrFQ9nZop2?p=preview

来源

2016-06-07 16:01:50

完整选项对象，因此这主要是完成我想要的一个问题。似乎这样做会将每个选项的值属性更改为“string：{value}”，而不是“{value}”。检查这个更新的plunker上的选择选项，看看我的意思。任何想法如何防止这一点，但保持其他功能？ https://plnkr.co/edit/66I229?p=preview –

为什么这会打扰你？当选定项目更改模型更新为正确值时。查看更新的plunker https://plnkr.co/edit/BezGaYjykfQrFQ9nZop2?p=preview –

更改您的选择是：

<select ng-options="option.text as option.text for option in options" ng-model="item.select"></select>

来源

2016-06-07 16:17:17

这将肯定工作：

由于您的NG-模型包含你需要在NG选项的对象绑定它，以及

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

来源

2016-06-07 17:17:21

角度默认选择选项

回答

相关问题