javascript 单击按钮时获取单选按钮值不起作用 angularjs
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26828869/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Getting radio button value when button is clicked is not working angularjs
提问by Blessan Kurien
I am new in angularjs.I want to fetch the radio button value when user click a button,but my bad luck its not working.Here is the code
我是 angularjs 的新手。我想在用户单击按钮时获取单选按钮值，但我的运气不好，它不起作用。这是代码
<label class="item item-radio">
<input type="radio" name="group" ng-model="user.answer" value="{{questions.quiz_ans_opt1}}">
<div class="item-content item-body">a) {{questions.quiz_ans_opt1}}</div><i class="radio-icon ion-checkmark"></i>
</label>
<label class="item item-radio item-body">
<input type="radio" name="group" ng-model="user.answer" value="{{questions.quiz_ans_opt2}}">
<div class="item-content item-body">b) {{questions.quiz_ans_opt2}}</div><i class="radio-icon ion-checkmark"></i>
</label>
<button class="button button-balanced button-block" ng-click="submitAnswer(user)">Submit</button>
Here is controller
这是控制器
$scope.submitAnswer = function(user) {
//it output undefined error
alert(user);
}
Also i want to disable the button until a radio button is checked,how can i achive this?
另外我想禁用按钮，直到选中单选按钮，我怎样才能做到这一点？
采纳答案by MaheshKumar
Please have a look at this,
请看看这个，
Try this,
试试这个，
In html,
在 HTML 中，
<body ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
<input type="radio" ng-model="user.answer" ng-value="'option a'">
<label>option a</label>
<br>
<input type="radio" ng-model="user.answer" ng-value="'option b'">
<label>option b</label>
<br>
<input type="radio" ng-model="user.answer" ng-value="'option c'">
<label>option c</label>
<br>
<input type="radio" ng-model="user.answer" ng-value="'option d'">
<label>option d</label>
<br>
<button ng-disabled="!user.answer" ng-click="submitAnswer(user)">Submit</button>
</body>
In app.js,
在 app.js 中，
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.submitAnswer=function(user){
alert(user.answer);
}
});
Here is the plunkerdemo for the same
这是相同的plunker演示
回答by Manish Kr. Shukla
Though a bit late, i would like to post a second approach, since you are using Ionic-Framework.
虽然有点晚了，但我想发布第二种方法，因为您使用的是 Ionic-Framework。
If you at all have a dynamic number of radio button options, that are being driven by backend data [Even if you have a static radio button set, you can convert it to the formal], Then you should instead use Ionic's Radio Buttons :
如果您有动态数量的单选按钮选项，这些选项由后端数据驱动[即使您有静态单选按钮集，您也可以将其转换为正式的]，那么您应该改用 Ionic 的单选按钮：
I.E, In your HTML :
IE，在你的 HTML 中：
<ion-radio ng-repeat="user in userAnswers"
ng-value="user.answer"
ng-model="finalAnswer">
{{ item.text }}
</ion-radio>
And in your controller :
在您的控制器中：
$scope.userAnswers = [
{ text: "Backbone", answer: "bb" },
{ text: "Angular", answer: "ng" },
{ text: "Ember", answer: "em" },
{ text: "Knockout", answer: "ko" }
];
$scope.finalAnswer = 'ng';
More Details can be found in the official documentationand the CodePen Demo
更多细节可以在官方文档和CodePen Demo 中找到
回答by Jason Spence
This post really helped me out. I ended up changing all my radio button ng-click events to ng-change. Hope this helps.
这篇文章真的帮助了我。我最终将所有单选按钮 ng-click 事件更改为 ng-change。希望这可以帮助。
