Angular 表单重置后保持无线电底部默认值处于选中状态-角度6

我有两个材质单选按钮，其中一个在我的角度反应形式中设置为默认值。表单提交后（保持在同一页面上），我想对所有表单控件进行重置，并将默认选中的单选按钮返回到选中模式

因此，我在TS中创建了一个

radioBtnDefault

prop，并将其设置为true，在表单重置后，我尝试将其设置为

false

，然后返回到

true

，但似乎表单重置功能直到值返回true才完成，因为当我使用

setTimeOut

时，只要稍微延迟一下，它就可以正常工作。 如果您对如何在不使用

setTimeOut

功能的情况下使用它有任何建议，我们将不胜感激

HTML

---

reset函数接受一个参数，该参数的值是将窗体重置为的值。如果不提供它，它将恢复为空值

this.appointmentsCreationForm.reset({'defaultProp': true});

---

或者任何适合你的价值观。如果您使用的是被动表单，我会避免使用[checked]属性。模型驱动表单背后的思想是，模型应该规定表单状态。类似地，您可能不想对（单击）做出反应，而是订阅表单控件提供的可观察到的值更改。

您需要绑定单选按钮的[value]属性

HTML

this.editMode = false;
    this.formSubmitted = false;
    this.colorSelectionOpen = false;
    this.radioBtnDefault = false;
    this.appointmentsCreationForm.reset();
    this.appointmentsCreationForm.get('participants').setValue('1');
    this.selectedBackgroundColor = '#EB5757';
    this.selectedTextColor = '#FFF';


    setTimeout(() => {
      this.radioBtnDefault = true;
    }, 100);

this.appointmentsCreationForm.reset({'defaultProp': true});

<form [formGroup]="formData">

    <mat-radio-group formControlName="IsActive">
    <mat-radio-button [value]="true">Active</mat-radio-button>
    &nbsp;&nbsp;&nbsp;&nbsp;
    <mat-radio-button [value]="false">Inactive</mat-radio-button>
    </mat-radio-group>

</form>

 formData: FormGroup;
 active: boolean;

 constructor(private _formBuilder: FormBuilder) { }

 formDataFunction(value: boolean){
    this.formData = this._formBuilder.group({
         IsActive: [value]
    })
 }

 ngOnInit() {
     this.formDataFunction(true);
 }

 onSubmit() {
     console.log(this.formData.value);
     this.active = this.formData.controls['IsActive'].value;
     this.formData.reset(
         this.formDataFunction(true)
     );
 }