嵌套ng-repeat中的几个单选按钮组，但只有最后一组显示值

Question

我有一个页面，我想用多个单选按钮更新一个表单。我查询api，并使用返回的对象数组来填充单选按钮的当前值。我有的问题是只有最后一组单选按钮实际显示值。这是我有（我使用的开始和结束符号的角[[和]]）的代码：

<fieldset data-ng-repeat="s in sections"> 
    <div class="form-group"> 
     <div class="col-md-12"> 
      <h2>[[ s.section.name ]]</h2> 
     </div> 
    </div> 

    <!-- Field Item --> 
    <div class="form-group m-b-20 bg-light" data-ng-repeat="f in s.fields"> 
     <div class="col-md-12 m-b-30"> 
      <h4>[[ f.field.name ]]</h2> 
      <input type="text" data-ng-model="f.comments" class="form-control input-md underline" placeholder="Comments"> 
     </div> 

     <div class="col-sm-3"> 
      <input type="radio" name="section-[[s.section.section_id]]-field-[[f.field.field_id]]" value="pass" class="form-control" data-ng-model="f.field_condition"> 
      <label class="eval-pass"><i class="fa fa-check-circle green"></i> Pass</label> 
     </div> 
     <div class="col-sm-3"> 
      <input type="radio" name="section-[[s.section.section_id]]-field-[[f.field.field_id]]" value="fail" class="form-control" data-ng-model="f.field_condition"> 
      <label class="eval-fail"> <i class="fa fa-exclamation-circle red"></i> Fail</label> 
     </div> 
     <div class="col-sm-3"> 
      <input type="radio" name="section-[[s.section.section_id]]-field-[[f.field.field_id]]" value="n/a" class="form-control" data-ng-model="f.field_condition"> 
      <label class="eval-na"> <i class="fa fa-circle blue"></i> N/A</label> 
     </div> 
     <div class="col-sm-3"> 
      <input type="radio" name="section-[[s.section.section_id]]-field-[[f.field.field_id]]" value="caution" class="form-control" data-ng-model="f.field_condition"> 
      <label class="eval-caution"><i class="fa fa-exclamation-triangle yellow"></i> Caution</label> 
     </div> 
    </div> 
    [[ f.field_condition ]] 
    <hr> 
</fieldset> 

所以基本上，我有几个部分，并且每个部分具有多个字段。每个字段都有它自己的单选按钮组（我正在使用节和字段ID来命名收音机组）。我目前看到的只是每个部分中的最后一个字段实际上显示了所选的单选按钮。其他字段没有任何选择，尽管ng-model的值肯定会有（我正在显示f.field_condition的值只是为了确保有值）。

对于每个字段，我可以看到模型已设置。如果我手动选择一个值，我可以看到模型发生了变化，所以在我看来模型的设置是正确的。我只是不知道它为什么最初不会显示为所有行的选择，而是最后一个。

我还应该提到，如果我保存表单即使丢失了单选按钮选择，数据库也会正确更新（它不会将值设置为空，如果手动更改所选值，则会更新它在数据库中也是如此）。

有没有人有任何想法？谢谢！

编辑

下面是该提琴，虽然，它正按预期在拨弄。 http://jsfiddle.net/dq8r196v/367/

我尝试使用静态数据，我用小提琴，但我仍然有同样的问题。有谁知道这是否可能是一个CSS问题？单选按钮是样式的，我没有写HTML或CSS。

UPDATE

我仍然有这个问题，所以我建立了一个新的角度应用，并且只有使用包含在我创建了小提琴的代码。即使相同的代码在小提琴中工作，我也遇到了与此新应用程序相同的问题。我真的不明白这里发生了什么，但是如果有人能够说出一些亮点，我会非常感激。

我从字面上将代码从我的小提琴复制并粘贴到一个新的角度应用程序，并且每个部分中只有最后一组单选按钮显示应用程序中的值。

这里是我的，如果别人想尝试一下，看看到底发生了什么新的角度应用程序的完整代码：https://pastebin.com/qSR33yfM

我创建了一个简单单页上的应用程序。

这里是链接到与精确JSON一个引擎收录，我用我的应用程序：https://pastebin.com/utfVVQfT

Answer 1

我定你通过简单地添加对象的代表不同的无线电阵列（$scope.values）有问题按钮选项，并使用ng-repeat创建单选按钮。请参阅更新后的代码如下：https://pastebin.com/s3hNzaXX

我知道有语义各地NG-重复创建新$scope S，和想象中有范围与嵌套NG-重复冲突在那里的正确结合单选按钮和在一个不同于你想要的范围（部分级别的ng-repeat）。

为了证实这一怀疑，你可以所有的插补转换在代码中使用的功能，并在不同的点CONSOLE.LOG s和f并确认field_condition被设定在你不打算的水平。

无论哪种方式，最好的做法是通过数据（和使用ng-repeat）创建单选按钮，就像使用$scope.values阵列一样，并且这样做的好副作用不仅是可以更新不同的通过AJAX使用数据的价值选项，或者您想要的数据选项，但是您不会遇到上述当前代码中遇到的奇怪角度范围问题。