Question

我想使用angular来实现可恢复的表单片段，比如

angular.module('xx').directive('snippetA', function () {
    return {
        scope: {
            form: '='
        },
        link: function (scope) {
            scope.form.validator.customValidator = function (value) {
                // return true or false;
            };
        },
        template: '<input ng-model="form.data.userName" custom-validator="form.validator.customValidator(form.data.userName)" name="userName">' + 
                '<input ng-model="form.data.userId" name="userId" required>'
    }
});

我使用隔离范围来防止范围污染。可能有一些customValidator函数。

这只是一个例子，现实世界的项目比这复杂得多。

某些属性只能由带有一些输入的表单显示，因此我将一个数据属性添加到表单对象。

<form angular-validator name="formName" angular-validator-submit="form.submit()" class="form form-horizontal">
    <snippet-a form="form"></snippet-a>
    // more inputs or snippets
    <button type="submit">submit</button>
</form>

$scope.form = {
    validator: {},
    data: {},
    submit: function () {
        // submit this.data
    }
}

目前，我使用angular-validation进行表单验证。它运作良好＆＃39;。但它的范围是“角度验证器”的范围。存在。因此，我必须使用不可更改的名称来命名，例如＆＃39; form＆＃39;！

结构是

$scope.form = {
    validator: {},
    data: {},
    submit: function ...
}

当我的页面只包含一个表单时，它运行正常。但是当我的页面包含多个表单时，它们的名称会发生冲突。

验证表单摘要的最佳做法是什么？

Answer 1

尝试添加表单：name="FormScope"。 Angular自动为表单处理和验证创建变量

<form name="FormScope" class="form form-horizontal">

console.log($scope.FormScope);

Demo ：请参阅此答案：https://stackoverflow.com/a/15090867/1074519

角形式片段如何验证

1 个答案: