使用AngularJS和Ionic取消选择单选按钮
问题描述:
我使用Ionic和AngularJS 1.x创建一个Survey应用程序,当用户提交表单时,我试图发送正确的数据。使用AngularJS和Ionic取消选择单选按钮
当一个问题有一组单选按钮(答案)时,当用户点击其中一个按钮时(按预期),我的应用程序将答案标记为“已选中”,但如果用户点击另一个选项,则前一个选项保持标记作为“选定”。所以,当提交数据时,我会在“单选按钮问题”中收到多个答案。
我认为我设定的单选按钮错误,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",
}
你能帮我弄清楚这个吗?我不知道我做错了什么。您可以看到复选框问题运行良好,但不是单选按钮。
非常感谢您提前。我会很感激你能给我的任何帮助。
答
这不是一个单选按钮在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}}
非常感谢您的回复。但是,我使用'ng-repeat'动态生成单选按钮,所以我不确定究竟要放在'ng-model'中。你可以看看codepen,并尝试把它放在正确的模型?我会很感激。在此先感谢@ e666 – Gustavo
查看编辑答案 – e666
非常感谢@ e666我不知道为什么我以前没有考虑过它。我是AngularJS的新成员,但我每天都在努力学习更多东西。非常感谢! – Gustavo