重置在角2

输入值我有如下输入输入字段：重置在角2

<input mdInput placeholder="Name" #filterName name="filterName" >

我想明确的按钮，点击清除值：

<button (click)="clearFilters()">Clear</button> 

app.component.ts function : 
filterName : string = null; 
clearFilters() { 

this.filterName = ''; 
}

请让我知道什么是错以上因为它不适合我。

这里的jsfiddle https://jsfiddle.net/8fw8uq3x/

来源

2017-07-24 Rush1312

https://angular.io/guide/reactive-forms寻找复位部分 – Doomenik

你可以做这样的事情

<input placeholder="Name" #filterName name="filterName" /> 
    <button (click) = "filterName.value = ''">Click</button>

或

模板

<input mdInput placeholder="Name" [(ngModel)]="filterName" name="filterName" > 
<button (click) = "clear()'">Click</button>

在组件

filterName:string; 
clear(){ 
this.filterName = ''; 
}

更新

如果它是一个形式

最简单，最明确的形式清晰的方式以及他们的错误状态（脏，prestine等）

this.form_name.reset();

欲了解更多关于表格的信息，请点击这里

https://angular.io/docs/ts/latest/guide/forms.html

PS：至于你问的问题有没有在你的代码有问题你所采用的简单的两日数据使用ngModel不 formControl结合的形式。

形式。reset（）方法仅适用于formControls重设呼叫

一个蹲下来显示这将如何工作link。

来源

2017-07-24 12:22:49

我使用了多个过滤器，如filterName，filterDept， – Rush1312

@ Rush1312你是什么意思？多个过滤器 –

多个过滤器意味着我已经使用了5个输入作为过滤器，并且希望在清除时单击清除所有输入值为空。顺便说一句，您的解决方案对我来说是form.reset（），因为我已经使用了窗体。谢谢哥们。 – Rush1312

使用@ViewChild重置控制。

模板：

<input mdInput placeholder="Name" #filterName name="filterName" >

代码：

@ViewChild('filterName') redel:ElementRef;

那么你就可以访问你的控制，

this.redel= "";

来源

2017-07-24 12:15:23 Vipin

clearFilters() {  
    var s = document.getElementById(filterName); 
    s.value = ''; 
}

来源

2017-07-24 12:21:27

直接在角度使用javascript不是adivisable，这将工作，但不是一个好的做法 –

您应该使用双向绑定。由于它是相同的组件，因此不需要有ViewChild。

因此，将ngModel添加到您的输入并留下剩余部分。这是你编辑的代码。

<input mdInput placeholder="Name" [(ngModel)]="filterName" name="filterName" >

来源

2017-07-24 12:21:55 cotnic

没有一个按钮你将如何重置价值？你应该添加这个'点击 click（）{this.filterName =''};' –

这个按钮已经被声明在他的代码中了。没有包含在我的anwser中。 – cotnic

你应该在答案中正确地提到它很难有人解密它 –

回答

相关问题