Data binding 聚合物与输入值结合,使验证工作正常

Data binding 聚合物与输入值结合,使验证工作正常,data-binding,polymer,paper-elements,core-elements,Data Binding,Polymer,Paper Elements,Core Elements,我有一个paper input元素,我将一个变量绑定到元素的inputValue,以便实时显示用户输入。该字段是必需的,因此如果该字段为空,则组件将按预期显示警告 清除变量时会出现问题,在这种情况下,验证状态不会更新 代码如下: <link rel="import" href="../polymer/polymer.html"> <link rel="import" href="../paper-input/paper-input.html"> <polymer-

我有一个paper input元素,我将一个变量绑定到元素的inputValue,以便实时显示用户输入。该字段是必需的,因此如果该字段为空,则组件将按预期显示警告

清除变量时会出现问题,在这种情况下,验证状态不会更新

代码如下:

<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-input/paper-input.html">

<polymer-element name="slimy-coconut" attributes="invalid,inputValue">
  <template>

    <paper-input required="true" invalid={{invalid}} inputValue={{inputValue}}></paper-input>
    invalid: {{invalid}}<br>
    inputValue: {{inputValue}}<br>
    <button on-click="{{cleanInputValue}}">Clean inputValue</button>
  </template>
  <script>
    Polymer('slimy-coconut', {

        cleanInputValue: function(event, detail, sender) {
        this.inputValue = "";

      }
    });
  </script>
</polymer-element>
<slimy-coconut name="Ele Dev"></slimy-coconut>

无效:{{invalid}}
inputValue:{{inputValue}}
净输入值 聚合物(“粘椰子”{ cleanInputValue:函数(事件、详细信息、发送方){ this.inputValue=“”; } });
下面是一个运行示例:


如何绑定到inputValue并使验证生效?

您可以将纸张输入的“无效”属性设置为false-

当我尝试时,只需单击两下按钮即可重置无效布尔值。我还尝试了:this.$.myinput.commit()来通知更新,但它不起作用。我看不到,您在什么平台上进行测试?您的意思是“真”吗?该字段为空时无效。无论如何,这是行不通的:该字段保持有效状态。我明白了-通过clean,我认为您的意思是要清除输入+验证错误。好的,是的,我看到了同样的问题。在这个例子中,我看到了与@sesteva相同的结果。非常确定这是一个bug,但看起来当前正在对paper input()进行重大重构,所以可能只需要在他们完成后重新测试。同时,这里有一个解决办法-