没有选择单选按钮的AngularJS问题

时间:2016-07-10 20:44:21

标签: angularjs radio-button

我试图在单选按钮上捕获ng-change事件,但问题是当我在同一组中的任何无线电上第二次点击时它才会被检查。此外,当我第一次点击收音机时,会调用ng-changed,但如果我再次点击另一个单选按钮或同一个单选按钮,它就不会。

<div>
<div ng-repeat="element in questions" ng-class="{'in':$first,'hidden': !$first}">
    <h1>{{element.question}}</h1>
    <div>
        <input type="radio" name="answer" ng-value="A" ng-model="$parent.answer" ng-change="enableSubmit()">{{element.answerA}}</input>
        <input type="radio" name="answer" ng-value="B" ng-model="$parent.answer" ng-change="enableSubmit()">{{element.answerB}}</input>
        <input type="radio" name="answer" ng-value="C" ng-model="$parent.answer" ng-change="enableSubmit()">{{element.answerC}}</input>
    </div>
</div>
<button id="prev" class="hidden" ng-click="prevQuestion()">Anterior</button>
<button id="next" ng-click="nextQuestion()" disabled>Siguiente</button>
</div>

这可能有什么问题?提前谢谢。

1 个答案:

答案 0 :(得分:1)

由于ng-repeat创建了自己的$scope,正如您在此answer中所看到的那样,您必须使用controller-as-syntax来实现您想要的目标。

使用代码的演示:

DEMO

注意:除了隐藏 / 禁用之外,我不知道您是否正在使用jQuery。 em>按钮,但全部可以通过 Angular 轻松完成,如下所示:

<input type="radio" ng-model="main.answer" value="A" ng-change="enableSubmit()" />

$scope.enableSubmit = function() {
    $('#next').prop('disabled', false);
};

应该只是在视图

<button ng-disabled="!main.answer" id="next" ng-click="nextQuestion()">Siguiente</button>

我希望它有所帮助!