使用Polymer 1.0进行密码和重新输入密码验证

使用Polymer 1.0进行密码和重新输入密码验证,polymer,polymer-1.0,Polymer,Polymer 1.0,我正在从Polymer 0.5迁移到Polymer 1.0,但我无法进行简单的验证—密码和重新输入密码字段的经典场景 对于聚合物0.5,我有: <paper-input-decorator id="passwordDecId" label="New password (8 caratteri almeno)" floatingLabel error="campo obbligatorio!"> <input id="passwordId" onchange="valid

我正在从Polymer 0.5迁移到Polymer 1.0,但我无法进行简单的验证—密码和重新输入密码字段的经典场景

对于聚合物0.5,我有:

<paper-input-decorator id="passwordDecId" label="New password (8 caratteri almeno)" floatingLabel error="campo obbligatorio!">
    <input id="passwordId" onchange="validatePassword()" is="core-input" type="password" name="password" required pattern=".{8,32}">
</paper-input-decorator>
<paper-input-decorator id="reenterPasswordDecId" label="Re-enter password (8 caratteri almeno)" floatingLabel error="campo obbligatorio!">
    <input id="reenterPasswordId" onchange="validatePassword()" is="core-input" type="password" name="reenterPassword" required pattern=".{8,32}">
</paper-input-decorator>
它工作了,但是现在,在迁移到Polymer 1.0之后,我不再使用paper input decorator,所以我想用paper input做所有事情:

<paper-input id="passwordId" onchange="validatePassword()" name="password" type="text" label="New password" auto-validate required pattern=".{1,32}" error-message="1 caratteri almeno"></paper-input>

<paper-input id="reenterPasswordId" onchange="validatePassword()" name="reenterPassword" type="text" label="Re-enter password" auto-validate required pattern=".{1,32}" error-message="1 caratteri almeno"></paper-input>


我不知道当两个密码的长度大于1个字符,但值不同时,以及当用户按下提交按钮或输入焦点丢失时,如何更改
validatePassword
函数以显示错误。

这里有一些如何验证匹配密码的示例使用聚合物1.0

<paper-input label="Password" required value="{{pass::input}}" id="checkPassword"></paper-input>
<paper-input label="Re-type Password" required value="{{repass::input}}" on-change="passmatch" id="checkPassword"></paper-input>

不确定它是否仍然是实际的,但您可以实现自定义验证器,请参见这里的如何实现
<paper-input label="Password" required value="{{pass::input}}" id="checkPassword"></paper-input>
<paper-input label="Re-type Password" required value="{{repass::input}}" on-change="passmatch" id="checkPassword"></paper-input>
passmatch: function(e){
      var password = encodeURIComponent(this.pass);
      var confirmPassword = encodeURIComponent(this.repass);
      if(password != confirmPassword){
        // do something
      }
    }