给定下面的select元素
<select ng-options="size.code as size.name for size in sizes "
ng-model="item.size.code"
ng-change="update(MAGIC_THING)">
</select>
是否有一种方法可以让MAGIC_THING等于当前选择的大小，这样我就可以访问size.name和size。控制器中的代码?
大小。代码会影响应用程序的许多其他部分(图像url等)，但当item.size.code的ng-model更新时，item.size.name也需要更新面向用户的东西。我假设做到这一点的正确方法是捕获更改事件并在控制器中设置值，但我不确定我可以将什么传递到update以获得正确的值。
如果这是完全错误的方法，我很想知道正确的方法。
当前回答
你也可以试试这个:
<select ng-model="selectedItem" ng-change="update()">
<option ng-repeat="item in items"
ng-selected="selectedItem == item.Id" value="{{item.Id}}">
{{item.Name}}
</option>
</select>
其他回答
AngularJS的Filter很适合我。
假设code/id是唯一的，我们可以用AngularJS的过滤器过滤掉特定的对象，并使用所选对象的属性。考虑上面的例子:
<select ng-options="size.code as size.name for size in sizes"
ng-model="item.size.code"
ng-change="update(MAGIC_THING); search.code = item.size.code">
</select>
<!-- OUTSIDE THE SELECT BOX -->
<h1 ng-repeat="size in sizes | filter:search:true"
ng-init="search.code = item.size.code">
{{size.name}}
</h1>
这里有三个重要的方面:
ng-init = "搜索。Code = item.size。Code " -在选择框外初始化h1元素时，将筛选器查询设置为所选选项。 ng-change = "更新(MAGIC_THING);搜索。Code = item.size。Code”—当您更改选择输入时，我们将运行另一行，将“search”查询设置为当前选择的item.size.code。 filter:search:true -将true传递给过滤器以启用严格匹配。
就是这样。如果大小。code是uniqueID，我们将只有一个h1元素的文本为size.name。
我已经在我的项目中进行了测试，它是有效的。
祝你好运
/ / Javascript 美元的范围。Update = function () { scope.myItem美元; alert('你好'); } <！——HTML > < div class = "形式的班级”> <选择name = "名称" id = " id " ng-model = " myItem " Ng-options ="size = size.name for size in sizes" 类= "表单控件" ng-change = " update () " 多个 要求> < /选择> < / div >
İf你想写，名字，id，类，多个，必需，你可以这样写。
<select ng-model="item.size.code">
<option ng-repeat="size in sizes" ng-attr-value="size.code">{{size.name}} </option>
</select>
这是从angular选择选项列表中获取值的最简洁的方法(除了Id或Text)。 假设你的页面上有一个这样的产品选择:
<select ng-model="data.ProductId"
ng-options="product.Id as product.Name for product in productsList"
ng-change="onSelectChange()">
</select>
然后在你的控制器中像这样设置回调函数:
$scope.onSelectChange = function () {
var filteredData = $scope.productsList.filter(function (response) {
return response.Id === $scope.data.ProductId;
})
console.log(filteredData[0].ProductColor);
}
简单解释:因为ng-change事件不识别选择中的选项项，我们使用ngModel从控制器中加载的选项列表中过滤出所选的项。
此外，由于事件是在ngModel真正更新之前触发的，你可能会得到不希望看到的结果，所以一个更好的方法是添加一个超时:
$scope.onSelectChange = function () {
$timeout(function () {
var filteredData = $scope.productsList.filter(function (response) {
return response.Id === $scope.data.ProductId;
})
console.log(filteredData[0].ProductColor);
}, 100);
};
你也可以试试这个:
<select ng-model="selectedItem" ng-change="update()">
<option ng-repeat="item in items"
ng-selected="selectedItem == item.Id" value="{{item.Id}}">
{{item.Name}}
</option>
</select>
