使用NG-repeat创建一个包含多个单选按钮的表单:希望重置所有单选按钮的值

Using NG-repeat to make a form with mutiple radio buttons: want to reset the value of all the radio buttons

本文关键字：单选按钮 希望 表单 NG-repeat 创建 一个 使用 包含多      更新时间：2023-09-26

我有一个关于Angular的问题;我有多个演员和每个演员呈现一个带有3个选项的单选框表单:受害者，原因和两者。

相关模板:

        <div class="actor" ng-repeat="activeActor in activeActors">                                                 
          <p class="category">{{activeActor}}</p>
          <form name="radioButtonForm">
            <div class="causerRadioForm">
              <input type="radio" name="causerRadio" value="victum" ng-model="defaultRadioButton" ng-click="setActorCauser(activeActor, 'victum')">
            </div>
            <div class="causerRadioForm">
              <input type="radio" name="causerRadio"  value="causer" ng-model="defaultRadioButton" ng-click="setActorCauser(activeActor, 'causer')">
            </div>
            <div class="causerRadioForm">
              <input type="radio"  name="causerRadio" value="both" ng-model="defaultRadioButton" ng-click="setActorCauser(activeActor, 'both')">
            </div>
          </form>
        </div>

这个工作得很好，但是我有一个按钮，如果我点击它，多个演员(称为fastActors)得到渲染，并有一个默认值victum。

问题是，当我选择一个演员，例如把它放在causer，然后点击fastActors，单选框保持在causer，而单选按钮应该重置为victum。

相关JS 

$scope.toggleFastTraffic = function(actor){
  //erase all actors 
  $scope.actors = [];
  $scope.report.traffic_players = [];
  //default value for radio boxes
  $scope.defaultRadioButton = "victum";

  $scope.SlowTraffic = false;
  $scope.FastTraffic = true;
  $scope.formOptionsExpanded = true;
  $scope.activeActors = [];
  var i = $scope.activeActors.indexOf(actor);
  console.log($scope.activeActors.indexOf(actor));
  if ($scope.counter === -1){
   //do more here
}

基本上，当我按下toggleFastActor时，我希望所有的单选按钮都成功。

友好的问候,T

注:我知道这个错误，我奉命保留它:P

这是一个快速的代码依赖，它还没有完成，但它确实包含错误:如果你按下汽车并将其设置为起因，然后切换快速交通，汽车在报告中会变成受害者(这很好)，但单选按钮不会改变。

p。代码依赖程序也有一些其他的错误，不需要注意那些。

http://codepen.io/CMD-Thomas/pen/yNbNaZ?编辑= 101

这是因为ng-model值是相同的。一旦你将'defaultRadioButton'的值设置为'causer'，它将始终保持为causer。记住MVVM模式

相关文章：