Angularjs 什么是「；棱角；处理表单验证的方法？

我在看这段代码：

function checkFormElements(field) {
    if ($scope.options === undefined || $scope.optionsForm.$error[field] === undefined ) {
        return false;
    }
    var result = false;
    $.each($scope.optionsForm.$error[field], function(index, value) {
        // TODO: There *has* to be a better way than this to get the element. Angular must know the form control, whether it's named or not.
        var element = $('[name=' + value.$name + ']');
        if (!element.prop('disabled')) {
            result = true;
        }
    });
    return result;
}

$scope.formIsInvalid = function() {
    return checkFormElements("pattern");
};

$scope.fieldIsEmpty = function() {
    if ($scope.options === undefined || $scope.formIsInvalid()) {
        return false;
    }
    return checkFormElements("required");
};

我很想把这件事做完

指令中的表单元素由以下内容生成：

    template: '\
        <input class="output-input" id="{{fieldName}}-input" name="{{fieldName}}" type="text" maxlength="64" ng-model="item.name" ng-pattern="pattern" ng-required="true" ng-trim="false" ng-disabled="item.save===false">\
        <div class="save-column" ng-if="showSave"><input type="checkbox" ng-model="item.save" ng-disabled="item.save === undefined" ng-checked="(item.save === undefined) || item.save"></div>\
    ',

模板：'\
\
\
',

基本功能是：

• 有多个编辑字段，旁边有一个保存框
• 如果字段中有垃圾，则表单字段$error.pattern存在。如果字段为空，则存在$error.required
• 我们循环所有此类错误，检查生成它的元素是否已启用（因为禁用的框可能包含垃圾内容或为空），如果已启用，则声明表单无效，因此不适合发送

---

感觉有一种更符合angular风格的解决方法，我想知道它是什么。

不是这样的。控制器需要尽可能少地工作。您需要使用指令进行表单验证。该指令描述字段的行为，然后在模板中调用它：

<form name="myName" novalidate ng-submit="action(myName)">
    <input class="output-input" id="{{fieldName}}-input" name="{{fieldName}}" ng-model="item.name" .... myDirective>
</form>

我建议您阅读angularjs手册了解指令：

---

您可以通过给表单命名来查看表单的所有属性。 呈现表单名称以查看AngularJS了解的所有信息

<form name="myForm">

</form>

{{myForm}}

{{myForm}}

我想你也应该要求ngModel，但我不确定你在这里做什么。

---

你可以添加一个提琴或图片吗？

你可能想看看这个博客-这是一篇关于angularjs与Bootstrap验证的好文章。表单在指令中，只是控制器中的上层代码块。除非我遗漏了什么，否则您的代码似乎并不实际包含处理检查正则表达式、检查空值或检查禁用值的代码，这正是上面代码试图解决的问题。基本上，“//函数检查字段是否有效”是我需要帮助的相关位。scope.$watch监视表单中的更改。您不应该在每次更改时检查所有字段。value参数是表单中的更改。在带有注释的标记位置，您可以进行以下操作：var myRegEx=/^myRegEx$/i；如果（myRegEx.test（value）==false），我将尝试在某个点上创建一个fiddle示例并运行，但核心行为是，对于后一个框中通过该指令创建的每个字段，我们需要检查是否违反了ng模式，或者是否违反了ng required状态，但仅当ng disabled为false时。这就是上面的代码所做的，但是以一种自我承认的方式。

<form name="myForm">

</form>

{{myForm}}