如何重置价值控制 [英] How to reset Control value
本文介绍了如何重置价值控制的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我试图做一个控制,我们可以用标签和他们的分数输入多个球员。
i'm trying to make a control where we can enter multiple player with tag and their score.
但是,当我们点击我AddPlayer按钮,我创建一个球员,然后我需要重置表单控件值默认值。
But when we click on my AddPlayer Button i create a player then i need to reset the form control value to default.
我已经尝试了很多东西,但没有工作....它永远不会改变的观点的价值。
i've tried a lot of things but nothing work.... it never change the view value.
这里是code:
addPlayer(form: ControlGroup) {
var player = new Player();
player.tag = form.value.tag;
player.name = form.value.name;
player.score = form.value.score;
// nothing work
form.value = null;
form.value.tag = null;
form.value.tag = '';
this.playerService.addPlayer(player.tag, player.name, player.score);
this.newplayer.next(player);
}
下面是HTML
here is the html
<form (submit)="addPlayer(playerForm)" [ng-form-model]="playerForm">
<div class="form-group" [class.has-error]="!playerForm.find('tag').valid && playerForm.find('tag').touched">
<div class="col-md-3 text-right">
<label for="tag">Tag: </label>
</div>
<input type="text" id="tag" #tag="form" [ng-form-control]="playerForm.controls['tag']" placeholder="Tag"/>
<span *ng-if="tag.control.hasError('required') && !tag.control.pristine">Tag is required</span>
</div>
<div class="form-group" [class.has-error]="!playerForm.find('name').valid && playerForm.find('name').touched">
<div class="col-md-3 text-right">
<label for="name">Player Name: </label>
</div>
<input type="text" id="name" #name="form" [ng-form-control]="playerForm.controls['name']" placeholder="Player Name" />
<span *ng-if="name.control.hasError('required') && !name.control.pristine">Player Name is required</span>
</div>
<div class="form-group" [class.has-error]="!playerForm.find('score').valid && playerForm.find('score').touched">
<div class="col-md-3 text-right">
<label for="score">Score: </label>
</div>
<input type="number" id="score" #score="form" [ng-form-control]="playerForm.controls['score']" value="0" min="0" max="200" />
<span *ng-if="score.control.hasError('required') && !score.control.pristine">Score is required</span>
</div>
<button type="submit" class="btn btn-primary">
Add Player
</button>
</form>
那么,怎样才能重置该控件的值?
So how can i reset the value of the control?
推荐答案
要重置表单的最简单方法就是重建表单生成器。
点击添加球员按钮后
To reset the form the easiest way is rebuild the form builder. After clicking the add player button
this.playerForm = this.builder.group({
'name': [...],
'tag': [...],
'score': [...]
});
这篇关于如何重置价值控制的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文