如何验证 ng-repeated 下拉类别选择器？

Question

我创建了一个嵌套类别模型。为了 select 产品的类别，您会看到一个包含主要类别的下拉列表。当您 select 一个时，会在右侧添加一个新的下拉列表，其中包含您 select 编辑的子类别。重复此操作，直到您到达最后一个级别。发生这种情况时 $scope.product.category_id 已设置。当 $scope.product.category_id 为 null 时，我想使整个字段集无效。

我一直在使用 angular-bootstrap-show-errors for validation and I tried to mix it with ui-utils 来实现这个，使用自定义函数：validate_category().

这是我使用的HTML：

<span ng-repeat="parent_id in category_dropdown_parents" show-errors="{ skipFormGroupCheck: true }">
    <select class="form-control" name="category_id"
        ng-init="selected_category[$index] = init_select($index);"
        ng-model="selected_category[$index]"
        ng-options="category.name for category in (categories | filter : { parent_id: parent_id } : true ) track by category.id "
        ng-change="select_category(selected_category[$index], $index)"

        ui-validate="'validate_category()'" // added this to work with ui-utils

        >
    </select> 
    <span ng-if="$index+1 != category_dropdown_parents.length">/</span>
</span>

这是我的简单验证函数：

$scope.validate_category = function() {
    return  (   $scope.product.category_id !== null 
            &&  $scope.product.category_id !== undefined);
}

但这不起作用。想法？

编辑：我刚刚意识到，这个问题是 ui-validate 上的验证函数是在 ng-change 函数之后执行的，所以它永远无法检查 $scope.product.category_id更新。

Answer 1

您的select正在使用

ng-model="selected_category[$index]"

但是验证函数正在使用

$scope.product.category_id

不应该使用

ui-validate="'validate_category($index)'"

和

$scope.validate_category = function($index) {
    return($scope.selected_category[$index] !== null 
    && $scope.selected_category[$index] !== undefined);
}

Answer 2

这不是理想的答案，但这是我能得到的最好的答案。真可惜，这太简单了：

<select class="form-control" name="category_id"
    ng-init="selected_category[$index] = init_select($index);"
    ng-model="selected_category[$index]"
    ng-options="category.name for category in (categories | filter : { parent_id: parent_id } : true ) track by category.id "
    ng-change="select_category(selected_category[$index], $index)"

    required // !!!

    >
</select>

就是这样，只是添加了 required 属性。这个问题是因为我没有验证 product.category_id 但只是验证所有下拉列表不为空。我想我必须依赖 select_category().

上的代码

如何验证 ng-repeated 下拉类别选择器？

How can I validate an ng-repeated dropdown category selector?

angularjs

validation

angularjs-ui-utils