角度js中的密码验证

时间:2014-01-25 21:23:25

标签: angularjs

我有一个directives.js文件,其中我定义了我的指令。我需要再添加一条指令进行密码验证。

我已经通过了很多链接。我无法成功。从以下链接,

password-check directive in angularjs

我无法理解为什么'data-password-verify'属性引用'passwordVerify'指令的定义?应该在哪里定义映射?

2 个答案:

答案 0 :(得分:0)

  

在以下示例中,我们说<input>元素   匹配 ngModel指令。

     

<input ng-model="foo">

     

以下匹配 ngModel

     

<input data-ng:model="foo">

     

Angular 将元素的标记和属性名称标准化为   确定哪些元素与哪些指令匹配。我们通常会提到   他们区分大小写的{@link指令   http://en.wikipedia.org/wiki/CamelCase camelCase} 规范化名称   (例如ngModel)。但是,由于HTML不区分大小写,我们参考   DOM中的指令采用小写形式,通常使用{@link   http://en.wikipedia.org/wiki/Letter_case#Computers划线划分}   DOM元素上的属性(例如ng-model)。

     

规范化过程如下:

     
      
  1. 从元素/属性的前面剥离x-data-
  2.   
  3. :-_ - 分隔名称转换为camelCase
  4.   

Read the documentation

答案 1 :(得分:0)

我对此感到挣扎,而且很乱。我在指令中看不到任何帮助,因为从逻辑上讲,所需要的只是通过验证来约束一个值以匹配另一个值。我需要的只是ng-pattern和一个辅助过滤器来将字符串转义为紧密的正则表达式。 (注意我检查电子邮件,但概念完全相同。)

我的代码:

<input type="email" name="email" ng-model="data.email" 
       required placeholder="jane.doe@example.com">
<input type="email" name="verify" ng-model="verify" 
       required ng-pattern="data.email | quotepattern">

quotepattern过滤器实现是:

function(input) {
  if (!! input) {
    return "^" + input.replace(/(\W)/g, "\\$1") + "$";
  } else {
    return input; 
  }
}

这对两者都有效,并检查有效性。如果第一个值发生更改,则两个控件都会更新。如果验证控制值发生更改,则只会影响该控件。

对我而言,这比指令hackery简单得多,并且在概念上也更加正确,因为从逻辑上讲,您需要做的就是检查验证控件中的字符串匹配。使用自定义编辑逻辑来设计一个全新的控件来实现这一目标只会滋生整个牦牛来削减它。