重置聚合物纸张输入容器值和标签

Question

我在提交表单后无法在纸张输入容器内重置标签。表单是一个简单的登录表单。如果用户在没有页面刷新的情况下（从浏览器）再次登录，注销和重新登录，则标签似乎卡住，就像输入中有值一样。

这是一张显示差异的图片：

这里是元素内部的形式：

<form is="iron-form">

    <paper-input-container id="email_container">
        <paper-input-error>E-mail or Password is incorrect</paper-input-error>
        <label>E-Mail Address</label>
        <input is="iron-input" id="email" on-blur="validateEmail" value="{{emailInput::input}}">
        </paper-input-container>

        <paper-input-container id="password_container">
            <label>Password</label>
            <input is="iron-input" id="password" type="password" value="{{passwordInput::input}}">
        </paper-input-container>

    <paper-button raised dialog-dismiss>Cancel</paper-button>
    <paper-button raised on-tap="handleCsrf">Login</paper-button>

</form>

这两种方法都可以在登录后获得表格＃34;陈述相同：

//
this.emailInput = null;
this.passwordInput = null;

//
this.emailInput = "";
this.passwordInput = "";

我认为这会以某种方式重置整个容器，但它什么都不做：

this.$.email_container = null;
this.$.password_container = null;

Answer 1

iron-input

  

bindValue   串   使用此属性而不是值来进行双向数据绑定。

<!-- body.html -->
...
<div ui-view>

</div>
...


<!-- home.html -->
<div ng-controller="bsCarouselController">
   {{logoName}}
</div>

<paper-input-container id="email_container"> <paper-input-error>E-mail or Password is incorrect</paper-input-error> <label>E-Mail Address</label> <input is="iron-input" id="email" on-blur="validateEmail" bind-value="{{emailInput::input}}"> </paper-input-container> <paper-input-container id="password_container"> <label>Password</label> <input is="iron-input" id="password" type="password" bind-value="{{passwordInput::input}}"> </paper-input-container> 显然bindValue和this.emailInput = null都有效。

Answer 2

我不确定为什么第一种形式不起作用（我使用纸张输入，而不是铁输入，并且它在那里工作），问题可能在代码中未显示的某处。但是要尝试的其他方法是直接设置值：

this.$.email.value = null; // where 'email' is the ID of the iron-input

我不完全确定这会如何与bind-value互动，但文档会说

  

iron-input添加了bind-value镜像value的属性   属性

Answer 3

您可以通过调用iron-form方法重置完整的reset()：

document.getElementById('idOfForm').reset();