在步骤1中输入字段发生变化时，重置垫步进器的步骤2中的值

Question

我的应用程序使用Angular材质步进器。每个步骤都有单独的组件。

parent.html:

<mat-horizontal-stepper [linear]="isLinear" #stepper>
<mat-step >
<app-child-1></app-child-1>
</mat-step>
<mat-step>
<app-child-2></app-child-2>
</mat-step>

</mat-horizontal-stepper>

child-1

<form [formGroup]="firstFormGroup">
<ng-template matStepLabel>Fill out your name</ng-template>
<mat-form-field>
<mat-label>Name</mat-label>
<input matInput placeholder="Last name, First name" formControlName="firstCtrl" required>
</mat-form-field>
<div>
<button mat-button matStepperNext>Next</button>
</div>
</form>

child-2

<form [formGroup]="secondFormGroup">
<mat-form-field>
<mat-label>Address</mat-label>
<input matInput formControlName="secondCtrl" 
required>
</mat-form-field>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>

它的工作原理就像当用户在步骤1中输入name时，第二种形式的address值将从后端加载。如果用户再次更改名称字段，地址字段将重置。我可以重置步进器，但它被设计成步进器重置不应该发生，我应该清除步骤2内的字段。可能的方法是什么是否可以将子1组件中的此字段绑定到子2组件的任何生命周期挂钩请引导我

Answer 1

使用[editable]="真"；垫内步进标签

先看示例代码，

示例：在此处输入链接描述