AngularJS Ng-模型选项无法在getter-setter函数中选择对象
AngularJS Ng-模型选项无法在getter-setter函数中选择对象
提问于 2017-11-16 16:48:06
我在使用ng-model和getter-setter函数从ng-model-options中选择对象时遇到了问题。我绑定到ng-model getter-setter函数setGetSelectedItem，它必须接受来自ng-options的对象--在我的例子中是item，并将其属性分配给另一个对象specific_data的属性。确实如此，对象被正确传递，但我无法在select选项中选择该选项。
<select name="item" ng-model="setGetSelectedItem"
ng-options="item as item.title for item in items"
ng-model-options="{getterSetter: true}">
<option value="">-- Please select --</option>
</select> 在主计长中：
$scope.items = [{
"description": "Item description",
"item_type": "OUT",
"id": 1,
"title": "Default item"
}];
$scope._objectDataRaw = {
specific_data: {}
};
$scope.setGetSelectedItem = function(value) {
if (arguments.length) {
$scope._objectDataRaw.specific_data.property_id = value.id;
$scope._objectDataRaw.specific_data.property_title = value.title;
$scope._objectDataRaw.specific_data.property_description =
value.description;
return $scope._objectDataRaw.specific_data;
}
};下面是对这个问题的修改：无法选择对象
我需要它作为对象传递，而不是以object.property的形式传递。任何帮助都将不胜感激。
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-11-16 22:39:31
与其使用getterSetter选项，不如使用指令设置specific_data对象：
<select name="item" ng-model="selectedItem"
ng-options="item as item.title for item in items"
̶n̶g̶-̶m̶o̶d̶e̶l̶-̶o̶p̶t̶i̶o̶n̶s̶=̶"̶{̶g̶e̶t̶t̶e̶r̶S̶e̶t̶t̶e̶r̶:̶ ̶t̶r̶u̶e̶}̶"̶
ng-change="setSelectedItem(selectedItem)" >
<option value="">-- Please select --</option>
</select>
angular.module("app",[])
.controller("ctrl", function($scope) {
$scope.items = [{
"description": "Item description",
"item_type": "OUT",
"id": 1,
"title": "Default item"
}];
$scope._objectDataRaw = {
specific_data: {}
};
$scope.setSelectedItem = function(value) {
$scope._objectDataRaw.specific_data.property_id = value.id;
$scope._objectDataRaw.specific_data.property_title = value.title;
$scope._objectDataRaw.specific_data.property_description =
value.description;
};
})<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="app" ng-controller="ctrl">
<select name="item" ng-model="selectedItem"
ng-options="item as item.title for item in items"
ng-change="setSelectedItem(selectedItem)" >
<option value="">-- Please select --</option>
</select>
<hr>
_objectDataRaw={{_objectDataRaw}}
</body>
Stack Overflow用户
发布于 2017-11-16 16:53:52
我认为你的代码应该是：
angular.module('myApp', [])
.controller('Ctrl1', function($scope) {
$scope.items = [{
"description": "Item description",
"item_type": "OUT",
"id": 1,
"title": "Default item"
}];
$scope._objectDataRaw = {
specific_data: {}
};
$scope.setGetSelectedItem = function(value) {
if (arguments.length) {
$scope._objectDataRaw.specific_data.property_id = value.id;
$scope._objectDataRaw.specific_data.property_title = value.title;
$scope._objectDataRaw.specific_data.property_description = value.description;
return $scope._objectDataRaw.specific_data;
}
};
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="Ctrl1">
<div>
<select name="item" ng-repeat="item in items">
<option value="">-- Please select --</option>
<option value="" ng-click="setGetSelectedItem(item)">{{item.title}}</option>
</select>
</div>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47335089
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号