聚合物：如何获得最大长度与纸张输入，而不是"iron-input"

Question

我已经开始尝试在我们的网站上学习和使用聚合物元素。我只需要允许用户在一年内输入4个数字，所以我想在我的论文输入中有一个maxlength="4"，但它不起作用，并且一直超过我的最大长度限制。

<paper-input floatingLabel label="Please add the year in the format YYYY" name="birth_date" type="number" maxlength="4" char-counter error-message="numbers only"></paper-input>

然而，当我把来自具有maxlength="4":的纸张输入容器的示例

<paper-input-container>
  <label>Your name</label>
  <input is="iron-input" maxlength="4">
</paper-input-container>

这似乎使输入停止在我的最大长度，但它也使用了比我想使用的多得多的代码，因为我有大量的表单问题要问用户，而且从我看过的文档和示例中，我不明白为什么我的maxlength不能在<paper-input>中工作。paper-inputs是我遗漏了什么，还是我用错了？

此外，如果有人知道用聚合物元素进行形式验证的任何好指南，也将不胜感激。对于我的问题，任何建议都非常感谢。

Answer 1

对于type="number"，可以设置属性max和min。要允许用户只输入4个字符，可以设置type="string"，然后使用自动验证模式属性验证是否输入了数字。

<paper-input label="only type numbers (auto-validate)" auto-validate pattern="[0-9]*" error-message="numbers only!" type="string" maxlength="4"></paper-input>

我发现这里的论文输入演示示例对故障排除很有用。