使用AngularJS和Ionic取消选择单选按钮

Question

我使用Ionic和AngularJS 1.x创建一个Survey应用程序，当用户提交表单时，我试图发送正确的数据。

当一个问题有一组单选按钮（答案）时，当用户点击其中一个按钮时（按预期），我的应用程序将答案标记为“已选中”，但如果用户点击另一个选项，则前一个选项保持标记作为“选定”。所以，当提交数据时，我会在“单选按钮问题”中收到多个答案。

Here´s my code in codepen

我认为我设定的单选按钮错误，here's的代码，它的提取物：

<ion-radio name="{{q.question}}" 
       ng-if="q.is_simple == 1" 
       ng-repeat="a in q.answers" 
       ng-model="a.selected" 
       value="true"> 
     {{a.answer}}</ion-radio> 

然后，如果用户用单选按钮播放和命中2其中，两个选项均被标记为“已选”。

"answers": [ 
    { 
     "id": "5", 
     "question_id": "2", 
     "answer": "Yes", 
     "selected": "true", 
    }, 
    { 
     "id": "6", 
     "question_id": "2", 
     "answer": "No", 
     "selected": "true", 
    } 

你能帮我弄清楚这个吗？我不知道我做错了什么。您可以看到复选框问题运行良好，但不是单选按钮。

非常感谢您提前。我会很感激你能给我的任何帮助。

Answer 1

这不是一个单选按钮在angularjs中的工作方式。

每个单选按钮必须具有相同的模型。然后这个值将被选中。

<ion-radio name="{{q.question}}" 
      ng-if="q.is_simple == 1" 
      ng-repeat="a in q.answers" 
      ng-model="mymodel.thisanswer" 
      ng-value="{{a.id}}"> 
    {{a.answer}} 
</ion-radio> 

编辑根据你想要的东西，这可能是店q.selectedAnswer。像这样，您将在所选答案的问题中拥有一个属性。 {{a.answer}}