javascript - AngularJS:无法读取嵌套 ng-repeat 中的单选按钮值

Question

我正在创建一个类似网格的日历，它使用两个 ng-repeats 生成从 1 到 31 的数字。网格的每个元素都是一个单选按钮，我想在 Controller 中获取其值。

例如，用户单击“12”，该值将存储在某处，然后单击“提交”就会传播到 Controller 。

问题是我无法读取所检查元素的值。

代码:

   <div data-toggle="buttons">
            <div class="row" ng-repeat="date in dates track by $index" ng-if="$index % 5 == 0">
                  <label ng-class="{'btn-online': isOnline(i+1), 'btn-paper': isPaper(i+1)}" class="singleDate btn btn-default col-no-gutter col-xs-2 letter-box" 
                       ng-repeat="i in [$index, $index + 1, $index + 2, $index + 3, $index + 4]" 
                       ng-if="dates[i] != null">
                            <input type="radio" name="dates" id="date-{{i+1}}" ng-model="$parent.dueDate" ng-value="{{date[i]}}" class="date radio radio-primary">{{dates[i]}} 
                  </label>
            </div> <!--row div ends here -->
            {{dueDate}} <!--no output here as well-->
        </div> 


        <button type="submit" ng-click="changeDueDate(dueDate)" class="btn btn-block btn-default">Change Payment Due Date</button>

Answer 1

不要绑定(bind)到基元

<!-- instead bind to objects -->

<button type="submit" ng-click="changeDueDate(obj.dueDate)">
  Change Payment Due Date
</button>

每个 ng-repeat 和 ng-if 都会添加一个新的范围和层次结构级别。不要计算层次结构的级别，而是将 dueDate 设为对象 obj.dueDate 的属性。然后原型(prototype)继承就会发挥它的魔力。欲了解更多信息，请参阅The Nuances of Scope Prototypal Inheritance .