paper-input-container 中的 pattern 属性是什么？

Question

我想自动验证某些 <paper-input-container> 的 <input is="iron-input"> 字段中的输入，以便它遵循 dd.mm.yyyy 模式。我可以使用 pattern 属性来做到这一点吗？

我尝试了 pattern="^(\d{2}).\d{2}.(\d{4})$" 和 pattern="(1-9|0[1-9]|1[0-9]|2[0-9]|3[0-1]).([1-9]|0[1-9]|1[0-2]).(20[1-3][0-9])" 以及 allowed-pattern="[\d.]"，但没有用。

pattern 属性是否支持此用例？

Answer 1

除非您执行以下操作之一，否则 <paper-input>.pattern 将被忽略：

使用 <paper-input>.autoValidate

启用自动输入验证

<paper-input auto-validate
             pattern="^(\d{2}).\d{2}.(\d{4})$">
</paper-input>

codepen

手动调用 <paper-input>.validate()（例如，单击按钮）

<paper-input id="input" pattern="..."></paper-input>
<button on-tap="_validateInput">Validate</button>

// script
_validateInput: function() {
  this.$.input.validate();
}

codepen

设置 <paper-input>.required，并使用 <iron-form> 包装器，在提交时自动调用 <paper-input>.validate()

<form id="form" is="iron-form" ...>
  <paper-input required
               pattern="..."></paper-input>
  <button on-tap="_submit">Submit</button>
</form>

// script
_submit: function() {
  this.$.form.submit(); // <-- auto validates required form inputs
}

codepen

paper-input-container 中的 pattern 属性是什么？

What's the pattern attribute in paper-input-container?

regex

polymer

polymer-1.0