Question

鉴于纸张输入

<paper-input 
  floatingLabel label="Type only numbers... (floating)" 
  validate="^[0-9]*$" error="Input     is not a number!">
</paper-input>

如何向用户添加该字段所需的一些指示。

Answer 1

来自core-input文档https://github.com/Polymer/core-input/blob/master/core-input.html AFAIK paper-input扩展core-input，因此这也适用于此：

core-input还可以选择通过提供
来验证该值
匹配的正则表达式或验证函数。
  如果输入值更改且无效，则会触发
“input-invalid”事件。

“无效”属性也可用于观察。

您可以将RegExp更改为

validate="^[0-9]+$"

http://www.regular-expressions.info/repeat.html

加号告诉引擎尝试匹配前一个令牌一次或多次。

更新

自2014-07-08办理登机手续以来，Polymer.js核心输入和纸张输入支持required属性。 Polymer.dart paper-elements发布于2014-06-25，因此尚不支持。它应该在下一个纸质元素发布之后起作用。

<paper-input 
  floatingLabel label="Type only numbers... (floating)" 
  validate="^[0-9]*$" error="Input     is not a number!"
  required>
</paper-input>

虽然error和validate似乎只有一个required属性。

已发布的paper-input demo不包含以required为特色的示例（GitHub repo中的演示代码已经执行），因此我不知道是否提供了您希望的行为。但是你已经可以使用required属性并使用像

这样的CSS自己应用星号

  * /deep/ paper-input[required] /deep/ #label::after,
  * /deep/ paper-input[required] /deep/ #floatedLabel::after {
    content: "*";
    font-weight: bold;
    font-size: 150%;
    color: red;
  }

如何为纸张输入添加所需指标

1 个答案:

更新