javascript - 自定义 Angular JS 验证

Question

假设我有 10 行的表格，每行有 10 列复选框

在用户提交之前我想添加以下验证:每行至少有两个复选框被选中!

<form name="myForm">
    <div data-ng-controller="myController">
        <table border="1">
            <tr>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
                <td><input type="checkbox" /></td>
            </tr>
            ...
        </table>

        <button data-ng-click="save()" ng-disabled="$myForm.invalid">Save</button>
</form>


$scope.save = function() {
    if (myForm.$valid){
        alert("can submit the form...")
    }
};

如何做到这一点？在哪里添加验证功能？

Answer 1

我最近answered a similar question 使用自定义指令，允许用户定义控件组(文本字段、选择、复选框等)，并要求每组中至少有一个控件不为空。

它应该易于修改，以便至少有两个控件不为空。
那么 myForm.$valid 将始终是“最新的”(因此您可以使用它来提供视觉反馈或允许提交表单)。