单击列表中的每个单选按钮后,ng-change不会触发

Question

我正在为我的大学项目创建一个小应用程序,我有一个场景,当用户点击一个单选按钮时,应该触发一个事件.

我的Angular代码块:

<div ng-repeat="q in questionList " ng-if="ExamOver == false">
      <h2>{{count+1}} .{{q.questionText}}</h2>
      <ul>
          <li ng-repeat="d in q.Choices">
              <input type="radio" name="isCorrect" ng-model="correctAnswer.isworking" ng-change="getDetails($index,d,correctAnswer.isCorrect);" value="Yes" />
              {{d.choiceText}}
          </li>
     </ul>
</div>

在我的控制器中,我有这个代码:

$scope.correctAnswer = {isCorrect : false};

$scope.getDetails = function (index, choiceList, isCorrect) {    
    /* some logic... */
}

事件每个按钮只发射一次,我试图解决这个过去几个小时没有任何进展,有人可以指导我在这里做错了吗？

Answer 1

ng-change当你绑定的变量(with ng-model)的值发生变化时,将触发.在这里,所有单选按钮都具有相同的功能value="Yes".这就是为什么不触发ng-change的原因.来自docs:

在用户更改输入时评估给定的表达式.表达式是立即计算的,与JavaScript onchange事件不同,后者仅在更改结束时触发(通常,当用户离开表单元素或按下返回键时).

一个好的解决方案取决于您的需求,但一些想法在哪里:

解决方案1

为输入设置不同的值:

<li ng-repeat="d in q.Choices">
     <input type="radio" 
            name="isCorrect" 
            ng-model="correctAnswer.isworking" 
            ng-change="getDetails($index, d, correctAnswer.isCorrect)" 
            ng-value="$index" />
     {{d.choiceText}}
</li>

解决方案2

只要点击一个无线电,就可以激活你的功能:

ng-click="getDetails($index, d, correctAnswer.isCorrect)"

Answer 2

如果 ngModel 的值发生变化，ngChange就会被触发。

您的单选按钮都具有相同的值，即“是”

<input type="radio" name="isCorrect" ng-model="..." ng-change="..." value="Yes" >