Angular mat切换按钮不会改变它'；单击后的s值

我有以下表单控件：

mStatus:new FormControl("closed",[])

这是我在模板中使用它的地方：

<mat-button-toggle-group disableRipple #group="matButtonToggleGroup"
formControlName="mStatus">
    <mat-button-toggle disableRipple class="m-btn locked" [attr.checked]="mStatus.value=='closed'? 'checked' : null" [value]="'closed'">
    </mat-button-toggle>
    <mat-button-toggle disableRipple class="m-btn opened" [attr.checked]="mStatus.value=='opened'? 'checked' : null" [value]="'opened'">
   </mat-button-toggle>
</mat-toggle-group>

---

尝试单击子本机按钮元素：

el.nativeElement.querySelector（“.mat按钮切换按钮”）。单击（）

不在角度组件上

.ts

mStatus:FormControl=newformcontrol（'closed'）

.html

将
formControlName=“mStatus”
更改为
[formControl]=“mStatus”
对我来说，有效的解决方案是获取底层输入元素（类型radio）并发送事件更改/

我的html代码片段包含以下内容：

 <mat-button-toggle-group #group="matButtonToggleGroup"
                             (change)="changeCalcType($event)">
      <mat-button-toggle [checked]="showPeriodic"
                         [value]="true">
        Periodic
      </mat-button-toggle>
      <mat-button-toggle [value]="false">
        PerPay
      </mat-button-toggle>
    </mat-button-toggle-group>

你确定你有正确的Css选择器吗？是的，我可以打印正确的本机元素。你可以发布方法的代码
mStatus.upadteValueAndvalidity
 <mat-button-toggle-group #group="matButtonToggleGroup"
                             (change)="changeCalcType($event)">
      <mat-button-toggle [checked]="showPeriodic"
                         [value]="true">
        Periodic
      </mat-button-toggle>
      <mat-button-toggle [value]="false">
        PerPay
      </mat-button-toggle>
    </mat-button-toggle-group>

it('', fakeAsync(() => {
    .....
    const componentSpy = spyOn(component, 'changeCalcType').and.callThrough();
    const matToggleEl = fixture.debugElement.queryAll(By.css('input[type="radio"]'));

    matToggleEl[1].nativeElement.dispatchEvent(new Event('change'));
    fixture.detectChanges();
    expect(componentSpy).toHaveBeenCalledTimes(1);
));