如果自定义模板验证器有同名的输入属性时，各验证器的行为是什么

Posted 2021-01-16 sagaminosakura

最近由于工作需要，使用了自定义模板验证器。其中有两个自定义验证器分别定义了一个同名的输入属性，导致两个验证器的验证逻辑出现了问题。经过实验，自己总结问题的原因和同名输入属性的适用规则如下。

1 同名输入属性根据DOM的顺序适用于所有包含该名输入属性的所有验证器。

   假设两个自定义验证器custom1和custom2，都包含prop输入属性。

   <input ngModel text=‘test‘ name=‘age‘ custom1 [prop]=‘"abc"‘ custom2 [prop]=‘"def"‘>

   对于上面的这个输入框，验证器custom1和custom2的输入属性prop的值都将是"abc"。

2 输入属性出现的位置可以在被验证元素内的任何位置，不一定非要紧跟验证器名。

  <input ngModel text=‘test‘ name=‘age‘ custom1 [prop]=‘"abc"‘ custom2 [prop]=‘"def"‘>和

  <input ngModel text=‘test‘ name=‘age‘ [prop]=‘"abc"‘ custom1 custom2 [prop]=‘"def"‘>效果相同。