简体   繁体   中英

How to clear an Input after form submission in Aurelia

Is there an Aurelia way to accomplish what I am trying to do? After I click add, I want the input to be set back to zero. Here is the app.js file

export class App {
  constructor() {
    this.message = 'Hello World!';
    this.array = [];
    this.array.push("Hello");
  }
  addToArray()
  {
    this.array.push(this.hello);
    hello = "";
  }
}

I tried setting the var hello back to an empty string, thinking Aurelia had them two way bounded. But then I thought that was silly, because you might want to mutate/manipulate the variable while in the function, and you wouldn't want the user to see it, so I guess setting hello back to an empty string wouldn't work. Here is the html.

  <form submit.trigger="addToArray()">
    <input type='text' value.bind="hello">
    <input type='submit' value="add">
    </form>

    <ul>
      <li repeat.for="a of array">${a}</li> 
      </ul>

It turns out they are bounded! Simple answer here, i needed to use this.hello = ""

Potentially, the model wouldn't update until the function has finished running, my guess is this is how it works. So as long as the bounded variable is set to something user friendly at the end of the function you should be fine making any changes to the value during execution

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM