Question

我正在制定指令以增加人员。

要求是设定数字，然后确定人的年龄和性别。

所以我的指令有选择下拉列表。第一个0到10来设置人数。当这个改变时，我有一个$ watch，它将person-objects添加到一个数组中。

$scope.$watch('selectedAntal', function(newValue, oldValue) {
  if (!newValue) {
    return;
  }

  for (var i = $scope.anonymousPersons.length; i < newValue; i++) {
    $scope.anonymousPersons.push({
      gender: 0,
      birthYear: -1
    });
  }

  updateNumber($scope, newValue, 10);
});

在我的html视图中，我对性别和选择下拉列表进行了ng-repeat birthYear。

<label for="numberOf_{{name}}">Choose number of persons</label>

<select name="numberOf_{{name}}" ng-model="selectedAntal" ng-options="x for x in antal" ng-required="true">
    <!--<option value="" default style="display: none;">Choose</option>-->
</select>

<table class="table">
    <thead>
        <tr>
            <th>Gender</th>
            <th>Birth year</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="person in anonymousPersons">
            <td>
                <select name="{{name}}_{{$index}}_gender" ng-model="person.gender" ng-options="x.text for x in genders" required >
                    <option value="" default style="display: none;">Choose</option>
                </select>
            </td>
            <td>
                <select name="{{name}}_{{$index}}_birthYear" ng-model="person.birthYear" ng-options="x for x in years" required >
                    <option value="" default style="display: none;">Choose</option>
                </select>
            </td>
            <td>
                {{person|json}}
            </td>
            <td><button ng-click="remove(person)">Remove</button></td>
        </tr>
    </tbody>
</table>

除验证外，一切正常。性别和出生年份的选择都需要设置。

但验证不起作用。

我的猜测是Angular对新创建的字段一无所知，但$ dirty字段有效。

如何将其添加到验证手动运行验证？

I have now made an example on plnkr that demonstrates the problem.

Answer 1

验证有效，但问题是您使用某些值初始化您的选择模型。在那种情况下，'要求'得以解决。如果使用null初始化模型，则不会有任何问题。

Angularjs验证动态添加的选择

1 个答案: