Question

我有一个组件是一个模态，它有一个表单和该表单之外的一些其他变量。组件是这样的：

组件：

$ ls ./files:
pie_mountain_11.png  pie_river_1.png      scatter_grass_12.png stack_field_30.png

$ ls -R ./subfolders
pie_charts_1      pie_charts_11     scatter_charts_12 stack_charts_30

subfolders//pie_charts_1:
pie_river_1.png

subfolders//pie_charts_11:
pie_mountain_11.png

subfolders//scatter_charts_12:
scatter_grass_12.png

subfolders//stack_charts_30:
stack_field_30.png

在模板中：

export class PersonComponent implements OnInit { 

countPerson: number=0;
persons: Person [] = [];

personForm : FormGroup;

ngOnInit(){
  this.step1Form= this.fb.group({
     firstName: 'Levi',
     lastName:  'Ackerman'
  });
}

submitPerson(person: Person){
  this.persons.push(person);
  this.incrementPerson();
}

incrementPerson(){
  this.count++;
}

}

我想将表单控件重置为初始值，并将表单外部的变量设置回初始值。所以基本上我希望整个组件回到初始状态。我希望一旦关闭，组件就会重置为初始状态。

Answer 1

如果您的HTML上有表单（未在提供的代码段中显示），您可以在表单上使用重置方法：this.yourFormName.reset()

这会将表单状态重置为原始状态并保持不变。

如何在Angular 2中将组件设置回初始状态

1 个答案: