Javascript 当ng repeat上的复选框具有必需属性时，Angular ng model将更改为undefined

我有一系列的应用程序。该数组的一个子集被推入另一个数组

$scope.applicant.selectedApps = [];
$scope.applicant.applications = applications;
angular.forEach(applications, function (application) {
    if(application.isSelected){
        $scope.applicant.selectedApps .push(application);
    }
}

我知道在这些阵列上有2个ng重复循环：

 <div class="row">
        <div class="form-group col-sm-10 col-sm-offset-1">
            <div class="radio">
                <label>
                    <input type="radio" name="intent" ng-model="applicant.intent" value="Y" required />YES
                </label>
            </div>
            <div class="row" ng-show="applicant.intent == 'Y'">
                <div class="col-xs-11 col-xs-offset-1">
                    <div class="row" ng-repeat="app in applicant.selectedApps">
                        <div class="col-sm-11 col-sm-offset-1">
                            <div class="checkbox">
                                <label>
                                    <input id="Prog{{app.appid}}" name="Progs" type="checkbox" ng-model="app.isSelected" ng-change="appChange(app)"  ng-required="applicant.intent == 'Y'" />
                                    {{app.Objective}} - {{app.Name}} - {{app.Description}}
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<div class="row">
        <div class="form-group col-sm-10 col-sm-offset-1">
            <div class="radio">
                <label>
                    <input type="radio" name="intent" ng-model="applicant.intent" value="N" required />NO
                </label>
            </div>
            <div class="row" ng-show="applicant.intent == 'N'">
                <div class="col-xs-11 col-xs-offset-1">
                    <div class="row" ng-repeat="dApp in applicant.applications">
                        <div class="col-sm-11 col-sm-offset-1">
                            <div class="checkbox">
                                <label>
                                    <input id="dProg{{dApp.appid}}" name="dProgs" type="checkbox" ng-model="dApp.isSelected" ng-change="dProgChange(dApp)" ng-required="applicant.intent == 'N' && appCount <= 0" />
                                    {{dApp.Objective}} - {{dApp.Name}} - {{dApp.Description}}
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

我观察到，当单选按钮切换到“否”时，每个初始化为“isSelected”=false的应用程序都将设置为未定义。当选择切换回“是”时，切换回false

这会导致每次单选按钮值更改时触发dProgChange

我不明白为什么“isSelected”会变成undefined

更新 在尝试创建一个简化的示例时，我注意到只要需要复选框，问题就会出现。 在下面列出的列表中，一旦取消选中复选框，复选框的模型值将设置为“未定义”。在我看来，这和我现在面临的问题是一样的

这就是AngularJS（

ng model

和

NgModelController

）的工作方式

有两个属性：

$viewValue

（用户输入的值）和

$modelValue

（绑定到模型的值）。当用户输入的值未通过验证时，

NgModelController

将模型设置为未定义

在AngularJS 1.3中，他们添加了指令。它允许您配置模型更新的方式/时间。您可以使用

allowInvalid

选项防止将模型设置为未定义：

<input type="checkbox"
    ng-model="myModel.value"
    ng-model-options="{allowInvalid: true}">

---

因此，我将补充这个答案，以供将来参考。这也适用于

。如果你有这样的事情

<input ng-model="speaker.vrange" ng-blur= "updateSpkV()" type="number" data-placement="right" min ="0" max="10"/>

---

如果将值设置为超出范围的值，并且模型变量将设置为未定义，则输入无效。当我直接输入一个越界值而不是使用向上/向下箭头来调整值时，这就成了我的一个问题。

是否可以将其作为代码片段发布，以便我们运行和检查？谢谢您的回复。这很有效。我还有一个问题需要更好地理解发生了什么。如果我取消选中复选框，为什么该值验证失败。“false”不是有效值吗？很好！False在大多数情况下都是完全可以接受的值。我的假设是，对于复选框，

required

属性似乎强制您选中复选框，而不是它有值。

<input ng-model="speaker.vrange" ng-blur= "updateSpkV()" type="number" data-placement="right" min ="0" max="10"/>