Angular/Valdr - 添加自定义 类 到 valdr-form-group

Question

我是 Angular 的新手。我正在使用 Valdr 来验证我在 Angular 中的表单。 我想在出现错误时在表单组上添加一些自定义 类 和我自己的 css。

在 Valdr 的文档中我找到了关于 CSS to control visibility 的这一部分。它说我需要注入 valdrClasses 并覆盖这些值。但是每次尝试都会出错。 我尝试将其添加为 module/provider 但没有任何效果。

我的代码没有 valdrClasses：

angular.module('validators', ['valdr'])
  .config(function (valdrProvider, valdrMessageProvider) {
    valdrProvider.addConstraints({
      'User': {
        'name': {
          'required': {
            'message': 'Name is required.'
          }
        },
        'email': {
          'required': {
            'message': 'Email is required.'
          },
          'email': {
            'message': 'Must be a valid e-mail address.'
          }
        }
      }
    });

    valdrMessageProvider.setTemplate('<div class="help-block">{{ violation.message }}</div>');

  });

有人能帮我正确的方向吗？因为我不知道如何注入和自定义 css 类.

Answer 1

将 valdr 服务注入到控制器或 运行 块中，并使用函数 setClasses.

例如，如果您只想覆盖 invalid:

app.run(function(valdr) {

  valdr.setClasses({
    invalid: 'my-invalid-class'
  });
});

演示： http://plnkr.co/edit/otLvNqXjRiJ4CGl8gDlu?p=preview

请注意，这可能取决于您使用的 Valdr 版本。