如何验证ng重复的下拉类别选择器？

Question

我创建了一个嵌套的类别模型.要为产品选择类别,您会看到包含主要类别的下拉列表.当您选择一个时,会在右侧添加一个新的下拉列表,其子类别将与您选择的类别相对应.这将重复,直到达到最后一级.发生这种情况时$scope.product.category_id设置.我想在整个的字段集无效$scope.product.category_id的null.

我一直在使用angular-bootstrap-show-errors进行验证,我尝试将它与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 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().