单选按钮未选择的 AngularJS 问题

Question

我试图在单选按钮上捕获 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>

这有什么问题吗？提前致谢。

Answer 1

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

使用您的代码的演示:

DEMO

注意:除了隐藏/禁用jQuery 做其他事情> 按钮，但是所有这些事情都可以用 Angular 轻松完成，就像这样:

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

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

在 View 中应该是这样的:

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

希望对您有所帮助!