重复指令中的角形验证

Question

我一直在学习棱角的验证表。我使用ng模式来定义输入的正确格式。但是，根据元素的参数($valid、$invalid、$error)定制类之后，需要大量代码来定义与验证相关的css行为。

因此，我正在探索建立一个可以包含所有必要行为的指导性元素的选项。

这里有一个柱塞说明了这一点：柱塞

下面是实现表单的方式，所以我只需要将指令元素与它们的属性堆叠在一起：(这里有2个输入，但可能更多)

<form role="form" class="form-horizontal" name="signup_form">

    <input-validation 
    ng-model="register.age" 
    namevalue="age" 
    formvalue="signup_form"
    labeltext="What's your Age?" 
    patterntext="/^[0-9]{1,2}$/" 
    errortext="Age must between 1 and 99" 
    placeholdertext="Enter your Age"></input-validation>

    <input-validation 
    ng-model="register.firstname" 
    namevalue="firstname" 
    formvalue="signup_form"
    labeltext="What's your Name?" 
    patterntext="/^[a-zA-Z0-9]{4,20}$/" 
    errortext="Name must between 1 and 20 characters long" 
    placeholdertext="Enter your Name"></input-validation>

  </form>  

有这样的指令：

app.directive('inputValidation', function(){
  return{
        restrict: 'E',
        templateUrl : 'inputValidation.html',
        scope: {
            inputtext: '=ngModel',
            formvalue: '=',
            namevalue: '=',
            labeltext: '@',
            errortext: '@',
            placeholdertext: '@',
            patterntext: '@',
            autofocusvalue: '@'
        }
    };
});

但这不能正常工作。我知道这个解决方案可以是编译、指令内部要求或者使用带有第四个参数(ctrl)的链接的组合，但我不知道如何实现它，可能需要一些帮助。

Answer 1

您可以尝试我的角度验证模块，而不是所有这些麻烦的http://www.jonsamwell.com/dynamic-angularjs-validation。

它有利于降低HTML和所有ng显示表达式的复杂性，这有利于向元素动态添加错误消息。这意味着您可以使用验证属性来修饰元素，而不必担心其他任何事情。现在也启用了i18n：)