Question

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

在angular的官方文档中，他们说要执行以下操作来设置默认值：

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

Answer 1

您应该定义＆＃34;选项＆＃34;的哪个属性？你想绑定到：

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

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

Answer 2

将您的选择更改为：

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

Answer 3

这肯定会有效：

由于你的ng-model包含完整的选项对象，你需要将它与ng-options中的对象绑定

<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>

Angular默认选择选项

3 个答案: