Question

假设我有一个后端调用，它返回一个对象（和属性）列表，我使用ng-option将其中一个属性（名称）粘贴到下拉列表中，该列表使用ng-model附加自身到我的模型对象。

当我需要访问所选对象的其他属性时，我的问题就出现了。 ng-option允许我将对象绑定到该下拉列表，这很棒。但是，如果我将名称拉出来将其绑定到我的模型：

<select ng-model="myModel.name" ng-options="fieldlist.fields.name as fieldlist.fields.name for fieldlist in metrics">

我失去了对象的其余属性的引用。我需要使用所选对象的另一个属性，比如说fieldlist.fields.location，在ng-change函数中执行一些其他操作。所以

这可能吗？我的Angular天真是否表现得太多了？

Answer 1

我相信你可以做到：

ng-model="myModel" ng-options="fieldlist.fields as fieldlist.fields.name for fieldlist in metrics"

假设您希望myModel包含所选字段列表中的所有字段

根据你的评论 - 这可能不是最佳做法，只是我最初的想法是如何做到这一点，你可以这样做：

ng-model="selectedItem" ng-change="setSelectedItem()" ng-options="fieldlist.fields.name as fieldlist.fields.name for fieldlist in metrics"

然后在你的控制器中

$scope.setSelectedItem() = function() { $scope.myModel.name = selectedItem.name; };

或删除ng-change并执行

$scope.watch(selectedItem, function() { $scope.myModel.name = $scope.selectedItem.name }

然后你可以从$scope.selectedItem

获得所需的任何财产

Answer 2

有点晚了，但是如果有人可以使用它，我发现了很好的信息。它仍然有点奇怪，但它使它更清洁。 Angular发布了一个ngModelOptions指令，除了其他有用的东西之外，它还允许你将ngModel定义为getter / setter函数。使用此功能，您可以删除那令人讨厌的更改或观看（可能还有$ Digest？）。只需将更新功能作为ng-model放置，并以此方式设置项目。

<select ng-model="updatefielset" ng-model-options="{getterSetter:true}" ng-options="fieldlist.fields as fieldlist.fields.name for fieldlist in metrics">



$scope.updatefielset(item) = function() 
{ 
  if(angular.isDefined(item)
  {
   $scope.myModel.A = item.A; 
   $scope.myModel.B = item.B;
   $scope.Val = item;
  } 
  return $scope.Val;
};

https://docs.angularjs.org/api/ng/directive/ngModelOptions

Angular ng-option访问多个属性

2 个答案: