如何使用ng-option设置选择元素的默认值

我在这里看到了Angular select指令的文档：http : //docs.angularjs.org/api/ng.directive :select 。我不知道如何设置默认值。这令人困惑：

选择作为数组中值的标签

这是对象：

{
    "type": "select", 
    "name": "Service",
    "value": "Service 3", 
    "values": [ "Service 1", "Service 2", "Service 3", "Service 4"] 
}

HTML（工作）：

<select><option ng-repeat="value in prop.values">{{value}}</option></select>

然后我试图在select元素内添加ng-option属性以设置prop.value为默认选项（不起作用）。

ng-options="(prop.value) for v in prop.values"

我究竟做错了什么？

因此，假设该对象在您的范围内：

<div ng-controller="MyCtrl">
  <select ng-model="prop.value" ng-options="v for v in prop.values">
  </select>
</div>

function MyCtrl($scope) {
  $scope.prop = {
    "type": "select", 
    "name": "Service",
    "value": "Service 3", 
    "values": [ "Service 1", "Service 2", "Service 3", "Service 4"] 
  };
}

工作的Plunkr：http：//plnkr.co/edit/wTRXZYEPrZJRizEltQ2g

select * 的角度文档没有明确回答此问题，但确实存在。如果您查看script.js，则会看到以下内容：

function MyCntrl($scope) {
  $scope.colors = [
    {name:'black', shade:'dark'},
    {name:'white', shade:'light'},
    {name:'red', shade:'dark'},
    {name:'blue', shade:'dark'},
    {name:'yellow', shade:'light'}
  ];
  $scope.color = $scope.colors[2]; // Default the color to red
}

这是html：

<select ng-model="color" ng-options="c.name for c in colors"></select>

这似乎是将<select>with中的选定值默认为默认值的更明显的方法ng-options。如果您使用不同的标签/值，它也将起作用。

* 这是从Angular 1.2.7开始的

当您从数据库中获取数据，进行修改然后保留更改时，此答案更有用。

 <select  ng-options="opt.id as opt.name for opt in users" ng-model="selectedUser"></select>

在此处查看示例：

http://plnkr.co/edit/HrT5vUMJOtP9esGngbIV

<select name='partyid' id="partyid" class='span3'>
<option value=''>Select Party</option>
<option ng-repeat="item in partyName" value="{{item._id}}" ng-selected="obj.partyname == item.partyname">{{item.partyname}}
</option>
</select>

如果您的对象数组很复杂，例如：

$scope.friends = [{ name: John , uuid: 1234}, {name: Joe, uuid, 5678}];

并且您当前的模型设置为：

$scope.user.friend = {name:John, uuid: 1234};

track by只要ng-model =“ user.friend”也有一个uuid，它有助于在uuid（或任何唯一字段）上使用该函数：

<select ng-model="user.friend" 
ng-options="friend as friend.name for friend in friends track by friend.uuid"> 
</select>

我花了几个小时苦苦挣扎，所以我想对此做些澄清，这里提到的所有示例都是指从脚本本身而不是从服务或数据库中加载数据的情况，因此，我想为遇到同样问题的任何人提供经验。

通常，您只在数据库中保存所需选项的ID，所以...让我们展示一下

service.js

myApp.factory('Models', function($http) {
var models = {};
models.allModels = function(options) {
    return $http.post(url_service, {options: options});
};

return models;
});

controller.js

myApp.controller('exampleController', function($scope, Models) {
$scope.mainObj={id_main: 1, id_model: 101};
$scope.selected_model = $scope.mainObj.id_model;
Models.allModels({}).success(function(data) {
    $scope.models = data; 
});
});

最后是部分html model.html

Model: <select ng-model="selected_model" 
ng-options="model.id_model as model.name for model in models" ></select>

基本上，我想指出那段“ model.id_model作为模型中模型的model.name ”，“ model.id_model ”使用模型的ID作为值，以便您可以与“ mainObj.id_model ” 匹配“ selected_model ”，这只是一个简单的值，“ as model.name ”也是转发器的标签，最后“ models in models ”只是我们都知道的常规循环。

希望这对某人有帮助，如果有帮助，请投票：D

<select id="itemDescFormId" name="itemDescFormId" size="1" ng-model="prop" ng-change="update()">
    <option value="">English(EN)</option>
    <option value="23">Corsican(CO)</option>
    <option value="43">French(FR)</option>
    <option value="16">German(GR)</option>

只需添加具有空值的选项。会的。

演示版

一个更简单的方法是像这样使用data-ng-init：

<select data-ng-init="somethingHere = options[0]" data-ng-model="somethingHere" data-ng-options="option.name for option in options"></select>

这里的主要区别是您需要包括 data-ng-model

在NG-模型属性设置所选择的选项，也可以让你管就像一个过滤器排序依据：orderModel.value

index.html

<select ng-model="orderModel" ng-options="option.name for option in orderOptions"></select>

controllers.js

$scope.orderOptions = [
    {"name":"Newest","value":"age"},
    {"name":"Alphabetical","value":"name"}
];

$scope.orderModel = $scope.orderOptions[0];

如果有人偶尔遇到默认值，而有时却没有在Chrome，IE 10/11，Firefox中填充该默认值，请尝试将此属性添加到输入/选择字段中，以检查HTML中的填充变量，如下所示：

<input data-ng-model="vm.x" data-ng-if="vm.x !== '' && vm.x !== undefined && vm.x !== null" />

如果您不关心使用一些数字ID为选项编制索引，这真的很简单。

1. 声明$ scope var-人数组

   $scope.people= ["", "YOU", "ME"];

2. 在上述范围的DOM中，创建对象

   <select ng-model="hired" ng-options = "who for who in people"></select>

3. 在您的控制器中，将ng-model设置为“ hired”。

   $scope.hired = "ME";

祝好运！！！真的很简单！

只是加起来，我做了这样的事情。

 <select class="form-control" data-ng-model="itemSelect" ng-change="selectedTemplate(itemSelect)" autofocus>
        <option value="undefined" [selected]="itemSelect.Name == undefined" disabled="disabled">Select template...</option>
        <option ng-repeat="itemSelect in templateLists" value="{{itemSelect.ID}}">{{itemSelect.Name}}</option></select>