嵌套NG重复的几个无线电按钮组，但仅最后一个组显示了该值

Question

我有一个页面，我想用几个无线电按钮更新表单。我查询一个API，并使用返回的对象数组来填充无线电按钮的当前值。我遇到的问题是，只有最后一组无线电按钮实际显示了值。这是我拥有的代码（我正在使用[[和]]用于Angular的开始和结尾符号）：

<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模型的值肯定确实可以，其他字段也没有任何选择（我正在显示F.Field_condition的值只是为了确保有一个值）。

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

我还应该提到，如果我保存表单，即使丢失的无线电按钮选择，数据库也会正确更新（它不会将值设置为null，并且如果我手动更改选定的值，则将其更新。DB）。

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

编辑

这是一个小提琴，尽管它在小提琴中正常工作。http://jsfiddle.net/dq8r196v/367/

我尝试使用小提琴中使用的静态数据，但是我仍然遇到同样的问题。有人知道这是否可能是CSS问题吗？广播按钮是样式的，我没有编写HTML或CSS。

更新

我仍在遇到这个问题，因此我构建了一个新的Angular应用程序，并且仅使用了我创建的小提琴中包含的代码。即使在小提琴中起作用相同的代码，我也对这个新应用程序遇到了同样的问题。我真的不明白这里发生了什么，但是如果有人能散发出一些灯光，我真的很感激。

我从小提琴中将代码复制并粘贴到了一个新的Angular应用中，并且每个部分中的最后一组无线电按钮都显示了应用程序中的值。

如果有人想尝试一下，这是我的新Angular应用程序的完整代码，并确切查看发生了什么：https：//pastebin.com/qsr33yfm

我在单个页面上创建了该应用，以简单。

这是我在应用程序中使用的精确json的链接：

我修复了您只需添加代表不同的无线电按钮选项的对象（$scope.values），并使用NG-Repeat来创建您的无线电按钮，就解决了您遇到的问题。有关更新的代码，请参见以下内容：https：//pastebin.com/s3hnzaxx

我知道围绕NG重复创建新的$scope s的语义，并想象与您的嵌套NG重复相关的范围有冲突，在这些语言中，它与无线电按钮的绑定到了不正确的范围，并且与您想要的范围不同（该部分）ng-repeat）。

要确认这一怀疑，您可以将代码中的所有插值转换为使用函数和控制台。LOGs和f在不同的点上，并确认field_condition正在以您不打算的级别设置为

无论哪种方式，都是通过数据（和使用NG重复）创建您的无线电按钮的最佳实践，就像$scope.values数组一样，这样做的良好副作用不仅可以更新不同的值选项使用AJAX或您想要的数据，但是您在上面的当前代码中遇到的时都不会遇到奇怪的角度范围问题。