Question

如果我没有type =“number”，以下代码效果很好使用type =“number”，我可以输入“...”或“ - 123--”或“eee”而不激活验证功能。
如何解决？ see Plunker example

<script>
    Polymer({
        is: 'custom-validator',

        behaviors: [
            Polymer.IronValidatorBehavior
        ]
 });

</script>

<dom-module id='validation-element'>
  <template>
    <custom-validator id="valid" validator-name="validator"></custom-validator>
    <paper-input type="number" auto-validate label='Amount' validator='validator' error-message="Invalid input!">
      <div prefix>$</div>
    </paper-input>
  </template>
</dom-module>
<script>
  Polymer({
    is: 'validation-element',

    validate: function(val) {
      var value = parseFloat(val);
      var isValid = !isNaN(value) && typeof value === "number";
      console.log('validator', isValid);

      return isValid;
    },

    ready: function() {
      this.$.valid.validate = this.validate.bind(this);
    }

  });
</script>

Answer 1

如果使用右侧的箭头修改值，则会调用validate函数。但是当你直接修改字段时，就不会像你说的那样调用它，我怀疑<iron-input>中有一个错误：

_onKeypress: function(event) {
  if (!this.preventInvalidInput && this.type !== 'number') {
    return;
  }
  var regexp = this._patternRegExp;
  if (!regexp) {
    return;
  }

  // Handle special keys and backspace
  if (event.metaKey || event.ctrlKey || event.altKey)
    return;

  // Check the pattern either here or in `_onInput`, but not in both.
  this._patternAlreadyChecked = true;

  var thisChar = String.fromCharCode(event.charCode);
  if (this._isPrintable(event) && !regexp.test(thisChar)) {
    event.preventDefault();
  }
},

您可以检测代码以查看事件是否已停止？

如何在Polymer中为custom-“number”的纸张输入制作自定义验证器？

1 个答案: