Question

我创建了一个指令（itcValidationMessages），它将让我显示验证消息，并将其作为属性放在表单元素上，如下所示：

<form id="register-form" novalidate ng-submit="register()" itc-validation-messages ...

我上面提到的指令，遍历表单中的所有输入元素，并在任何人有无效状态时显示错误消息。

我将验证消息存储在单独的文件中（因为它们可能有很多，我想为i8n做准备，所以我将它们与指令分开），如下所示：

angular.module('models.ValidationMessages', []).constant("ValidationMessages", {
validationMessages: {
    required: 'Value is required!',
    email: 'You should enter a valid email address!',
    minlength: 'Enter more characters!',
    maxlength: 'You have entered to many characters!'
}

}）;

将这些消息保持不变是否正确？

我有一个每个验证器的默认消息，但我想让每个输入添加一个自定义消息，例如：

<input type="password" minlength-message="Your password should has at least 3 characters"

最好的方法是什么？因为为什么我使用上面的属性（minlength-message），我无法使用$observe从我的指令访问它。我不想声明一个对象并将这些自定义消息放在一个地方，因为我应该在每个消息中添加一个输入名称以识别它们属于哪个输入。所以我试着找一些方便的，并根据艺术解决方案。

我不需要itcValidationMessages指令中的隔离范围，我不希望为每个验证器（如minlengthMessage）提供单独的指令，将特定的验证消息传递给我的指令，该指令应该显示此消息（itcValidationMessages）。

Answer 1

以下是如何从指令访问数据的示例：

var myModule = angular.module('myModule', [])
    .directive('myComponent', function () {
        return {
            restrict:'E',
            scope:{
                minlengthMessage:'@'
            }        
        };
    })

所以现在你可以从

获取字符串

$scope.minlengthMessage

Answer 2

您还可以使用传递给指令链接功能的attrs。

以下是一个例子：

.directive('minlength', function () {
     return {
          restrict: 'EA',
          link: function ($scope, $element, $attrs) {
              var myDirectiveParam = $attrs.minlengthMessage;
          }
     };
})

在你的HTML中：

<input minlength minlength-message="Your message here.." />

将一些属性传递给AngularJS中的指令

2 个答案: