以下是困扰很多人(包括我)的问题。
当在AngularJS中使用ng-options指令来填充<select>标记的选项时，我不知道如何为一个选项设置值。这方面的文档确实不清楚——至少对我这样的傻瓜来说是这样。
我可以像这样轻松地设置一个选项的文本:
ng-options="select p.text for p in resultOptions"
例如，当resultOptions为:
[
{
"value": 1,
"text": "1st"
},
{
"value": 2,
"text": "2nd"
}
]
它应该是(可能是)设置选项值最简单的事情，但到目前为止，我只是不明白它。
当前回答
如果你想改变选项元素的值，因为表单最终会提交给服务器，而不是这样做，
<select name="text" ng-model="text" ng-options="select p.text for p in resultOptions"></select>
你可以这样做:
<select ng-model="text" ng-options="select p.text for p in resultOptions"></select>
<input type="hidden" name="text" value="{{ text }}" />
然后，期望的值将以正确的名称通过表单发送。
其他回答
就像很多人之前说的，如果我有这样的数据:
countries : [
{
"key": 1,
"name": "UAE"
},
{
"key": 2,
"name": "India"
},
{
"key": 3,
"name": "OMAN"
}
]
我会这样使用它:
<select
ng-model="selectedCountry"
ng-options="obj.name for obj in countries">
</select>
在你的控制器中，你需要设置一个初始值来消除第一个空项:
$scope.selectedCountry = $scope.countries[0];
// You need to watch changes to get selected value
$scope.$watchCollection(function() {
return $scope.selectedCountry
}, function(newVal, oldVal) {
if (newVal === oldVal) {
console.log("nothing has changed " + $scope.selectedCountry)
}
else {
console.log('new value ' + $scope.selectedCountry)
}
}, true)
今天我已经为这个问题纠结了一段时间。我通读了AngularJS的文档，这篇文章和其他一些文章，还有一些它们指向的博客。他们都帮助我理解了更细微的细节，但最终这似乎是一个令人困惑的话题。主要是因为ng-options的许多语法细微差别。
最后，对我来说，它归结为少即是多。
给定一个作用域，配置如下:
//Data used to populate the dropdown list
$scope.list = [
{"FirmnessID":1,"Description":"Soft","Value":1},
{"FirmnessID":2,"Description":"Medium-Soft","Value":2},
{"FirmnessID":3,"Description":"Medium","Value":3},
{"FirmnessID":4,"Description":"Firm","Value":4},
{"FirmnessID":5,"Description":"Very Firm","Value":5}];
//A record or row of data that is to be save to our data store.
//FirmnessID is a foreign key to the list specified above.
$scope.rec = {
"id": 1,
"FirmnessID": 2
};
这就是我想要得到的结果:
<select ng-model="rec.FirmnessID"
ng-options="g.FirmnessID as g.Description for g in list">
<option></option>
</select>
注意，我没有使用track by。使用所选项的跟踪将总是返回与FirmnessID匹配的对象，而不是FirmnessID本身。这现在满足了我的标准，即它应该返回一个数值而不是对象，并且使用ng-options来获得它所提供的性能改进，而不是为生成的每个选项创建一个新的作用域。
同样，我需要空白的第一行，所以我简单地在<select>元素中添加了一个<option>。
这是一个展示我作品的Plunkr。
对于对象:
<select ng-model="mySelect" ng-options="key as value for (key, value) in object"></select>
如果你想改变选项元素的值，因为表单最终会提交给服务器，而不是这样做，
<select name="text" ng-model="text" ng-options="select p.text for p in resultOptions"></select>
你可以这样做:
<select ng-model="text" ng-options="select p.text for p in resultOptions"></select>
<input type="hidden" name="text" value="{{ text }}" />
然后，期望的值将以正确的名称通过表单发送。
而不是使用新的'track by'功能，你可以简单地对一个数组这样做，如果你想要的值与文本相同:
<select ng-options="v as v for (k,v) in Array/Obj"></select>
注意标准语法之间的区别，标准语法将使值成为对象/数组的键，因此对于数组来说是0、1、2等:
<select ng-options"k as v for (k,v) in Array/Obj"></select>
K (v)变成了v (v)
我是根据语法常识发现这一点的。 (k,v)是将数组/对象拆分为键值对的实际语句。
在'k as v'语句中，k将是值，v将是显示给用户的文本选项。我认为“track by”是一种混乱和过度的表达。
