如何在AngularJS中使xeditable选择输入成为必需（必需）

Question

我有一个使用Angular Bootstrap的AngularJS项目，并且我使用Angular-xeditable库来处理表中的某些就地编辑字段。

我拥有的输入之一是“选择”输入，即允许用户选择一个选项的下拉列表。 （editedit-在xeditable中选择）。 保存表单时，我试图使此输入为强制性，但是我找不到解决方法。 与所有x可编辑控件类似，我希望可以简单地在标准angular指令中添加e-前缀，以将该指令应用于xeditable控件，也就是说，我应该能够添加e-ng-required =“ ”以使它成为强制性。 但这行不通。 添加此代码时，我没有收到任何错误，但它没有“做任何事情”。 我仍然可以保存表单而无需选择项目。

以下是我正在尝试执行的代码示例：

<form editable-form name="tableform" onaftersave="saveSubmissions()" oncancel="cancel()">
    <table>
        <!--Define table headings and columns...-->
        <!--Define an ng-repeat to display each row-->
        <tr ng-repeat="currentRow in dataRows">
            <!--Add some columns for the row-->
            <!--Add the select/drop-down column pertaining to this question-->
            <td>
                <span editable-select="currentRow.vendorID" e-ng-options="x.vendorId as x.name for x in vendors" e-form="tableform" e-ng-required="true">
                    {{showVendor(currentRow)}}
                </span>
            </td>
            <!--Add some more columns for each row-->
        </tr>
    </table>
</form>

即使我在元素上设置了e-ng-required =“ true”，它也不会执行任何操作。 如何使用xeditable强制选择项目？ 我搜索了示例，但找不到任何有用的信息。

Answer 1

不幸的是，required不适用于表单验证器，如以下链接所述

必填字段验证无效

使用标签“ form”和angular-xeditable的验证字段表单

您必须在保存之前手动检查并设置输入的有效性，并设置输入元素的有效性。

html

<span editable-select="currentRow.vendorID" e-ng-options="x.vendorId as x.name for x in vendors" e-form="tableform" e-name="vendor" onbeforesave="checkValidity()">
    {{showVendor(currentRow)}}
</span>

js

$scope.checkValidity = function(){
    if(valid){
        $scope.tableform.$setValidity("vendor", true);
    }
    else{
        $scope.tableform.$setValidity("vendor", false);
    }
}