Angularjs 带有ng消息验证的输入指令

我想知道这样的事情在美国是否可行

<form name='form'>
  <input-directive-with-ngmessages1 ... inputname='field1' form='form' />
  <input-directive-with-ngmessages2 ... inputname='field2' form='form' />
</form>

我知道angular中的验证系统是基于表单名称工作的，但我想从输入中生成组件，将ng消息移动到自定义输入指令中，只向其传递表单名称，并有可能获得整体表单验证状态

---

我正在寻找stackoverflow上的动态表单/验证，但我没有发现上面的例子，thx Prevence肯定是可行的。我的建议是：需要一个

ngModel

使自定义控件（如上所述）对消息使用转换。示例代码：

app.directive('inputDirectiveWithNgmessages', function() {
    return {
        restrict: 'E',
        template:
            '<input type="text" ng-model="ctrl.model" name="ctrl.inputname" />' + 
            '<div ng-messages="ctrl.$error" role="alert" ng-transclude>' +
                // element content, i.e. the messages will be transcluded here
            '</div>',
        transclude: true,
        scope: {},
        require: ['ngModel', 'inputDirectiveWithNgmessages'],
        link: function(scope, elem, attrs, ctrls) {
            var ngModel = ctrls[0];
            var inputDirectiveWithNgmessages = ctrls[1];
            inputDirectiveWithNgmessages.inputname = attrs.inputname;
            inputDirectiveWithNgmessages.setModel(ngModel);
        },
        controllerAs: 'ctrl',
        controller: function($scope) {
            var self = this;

            this.model = null;

            this.setModel = function(ngModel) {
                this.$error = ngModel.$error;

                ngModel.$render = function() {
                    self.model = ngModel.$viewValue;
                };

                $scope.$watch('ctrl.model', function(newval) {
                    ngModel.$setViewValue(newval);
                });
            };
        }
    };
});

my pattern

指令将使用

ngModel

的标准

$validators

管道来实现正则表达式验证

这样做的好处是可以调整指令的模板以满足任何需要。例如，它可以为Twitter的引导创建表单元素标记

---

最后，您可能希望查看表单验证的替代方法，即基于模型的验证。

我考虑了类似的方法：这包含大量不必要的重复代码：检查

inputName.js

，

inputAge.js

，之间的差异，

inputEmail.js

和

input age.html

，

input name.html

，

input email.html

。对于许多输入，它无法很好地扩展。

<input-directive-with-ngmessages ng-model="model1" inputname="field1" ng-required="true">
    <div ng-message="required">Required field</div>
</input-directive-with-ngmessages>

<input-directive-with-ngmessages ng-model="..." inputname="..." my-pattern="[A-Z][0-9]">