Question

我正在尝试使用Angular的ng-options创建一个选择小部件。到目前为止我有这个：

<select id="id_question" name="question" ng-model="post.Question"
    ng-options="question.id as question.title for question in questions"
    ng-change="updateFields(post.Question)" required>
</select>

我需要一个传递的对象作为'updateFields'方法的参数。但是，由于ng-options使用'id'，这是不可能的。

如何保留使用id作为select小部件中的值，但是还能够将'question'对象作为ng-change中的参数传递？

Answer 1

如果使用ng-options，则无法将完整对象传递给函数。相反，您可以将ng-model设置为其他属性，并使用该属性为post.Question变量赋值。

<select name="question" ng-model="selectedValue"
        ng-options="question as question.title for question in questions"
        ng-change="updateFields(selectedValue)" required>
</select>

JS中的

    $scope.updateFields = function(question) {

       $scope.id = $scope.selectedvalue.id;
        console.log(question);
  }

请查看plunker

Answer 2

如果您对选择元素使用ng-model，则无需在ng-change中将所选对象作为事件参数传递。

看看下面的代码

$scope.updateFields=function(){
      console.log($scope.selectedQuestion);
    }

您的HTML必须为

<select name="question" ng-model="selectedQuestion"
    ng-options="question as question.title for question in questions"
    ng-change="updateFields()" required>

<强> LIVE DEMO

假设json

$scope.questions=[
    {title:'A',id:1},
    {title:'Abcdef',id:4}];

在选择表单输入中使用ng-changes和ng-changed

2 个答案: