使用object作为ng-value将值设置为[object Object]

时间:2017-03-27 09:47:31

标签: angularjs angularjs-scope

我有一组来自JSON文件的问题。

在我看来,我循环遍历这些问题并输出输入类型:

<div ng-repeat="question in questions" id="{{question.id}}">
    <div ng-if="question.answerStyle == 'select'">
        <select ng-model="question.answer">
            <option value="" disabled selected hidden>Choose answer...</option>
            <option ng-repeat="option in question.answers" ng-value="{{option}}">{{option.name}}</option>
        </select>
    </div>
</div>

在控制器中,我正在观察任何更改的$ scope.questions,然后注销范围。

答案设为:

[object Object]

我需要将答案作为对象传递给需要的值和问题文本。

来自Array的示例问题数据:

[
    {
        "id":"questionId",
        "answerType":"single",
        "answerStyle":"select",
        "title":"Question Title",
        "answers":[
            {
                "value":0,"name":"3 years"
            }
    }
]

3 个答案:

答案 0 :(得分:2)

这是因为您正在更改分配var arrayObjects = dates.map(e => ({date: e})) ,即"db.collection1.aggregate({$lookup:{from: "是一个对象本身,您需要将对象的属性分配给ng-value="{{option}}"。试试这个:

更改

option

ng-value

答案 1 :(得分:2)

如果您想将整个对象作为值,则可以执行此操作

使用value代替ng-value。当你在ng-model的select box值中选择一个选项时,这将是字符串值的下降。因为你需要使用JSON.parse()

将字符串转换为json

我个人不推荐这个,但由于你需要整个对象作为价值,这是你可以做的一种方式。如果您想要一个值选项,那么您可以轻松使用ng-value

angular.module("app",[])
.controller("ctrl",function($scope){
  
  $scope.questions = [
    {
        "id":"questionId",
        "answerType":"single",
        "answerStyle":"select",
        "title":"Question Title",
        "answers":[
            {
                "value":0,"name":"3 years"
            },
            {
                "value":0,"name":"2 years"
            }]
    }
]

$scope.changeItem = function(item){
  $scope.item = JSON.parse(item)
  console.log($scope.item)
}
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <div ng-repeat="question in questions" id="{{question.id}}">
    <div ng-if="question.answerStyle == 'select'">
        <select ng-model="question.answer" ng-change="changeItem(question.answer)">
            <option value="" disabled selected hidden>Choose answer...</option>
            <option ng-repeat="option in question.answers" value="{{option}}">{{option.name}}</option>
        </select>
    </div>
    {{question.answer}}
</div>
</div>

答案 2 :(得分:0)

我认为您滥用相同的数据模型 question.answers 使用两个模型处理数据并回答