如何使用角度2重置文本框？

Question

我想通过angular 2方法重置文本框。 我试过下面的代码，但它没有用。

this.searchValue = null;
//or
this.searchValue = ' ';

Answer 1

没有任何代码示例，这应该有效：

在模板：

中

<input type="text" #myinput />
<button (click)="clear(myinput)">Clear</button>

在组件：

中

clear(input: HTMLInputElement){
  input.value = ''; // null should work too, but as the type ov the value is string I like to use ''
}

Answer 2

假设this.search_value是组件内部的变量，并假设模板中的输入和清除按钮设置为：

<input type="text" [(ngModel)]="search_value" />
<button (click)="clear()">X</button>

然后在组件中，您需要创建一个执行clear函数的并行方法：

clear() {
   this.search_value = ''
}

this.search_value = ''本身没有任何意义。它需要先绑定或绑定＆＃34;到您的模板（注意我已经使用ngModel指令来执行此操作）。然后你需要一个函数（在这种情况下是一个带有click指令的按钮），它可以用你的组件变量做你想要的。