mat-slide-toggle [checked] 属性似乎不起作用

Question

我有一个 <mat-slide-toggle> 我这样定义的 :

<mat-slide-toggle [checked]="synchronizationState === 'ENABLED'"
                  [disabled]="!canChangeSynchronizationState"
                  formControlName="enableSynchronization"
                  #enableSynchronizationToggle
                  (change)="openConfirmSynchronizationStateDialog(enableSynchronizationToggle.checked)">
</mat-slide-toggle>

然而，当用户点击开关时，它会改变状态（如果选中，则未选中，反之亦然），即使 synchronizationState 没有改变。

我已经像这样进一步测试了组件： <mat-slide-toggle [(ngModel)]="checked" [checked]="checked"></mat-slide-toggle> 其中 checked = false; 看来我仍然可以更改切换状态。

看起来 mat-slide-toggle 根本不关心我在 [checked] 中输入的内容，我在这里做错了什么？

Answer 1

不确定 goal/use 的情况，但这是设计使然。

虽然它可以被操纵，但强烈建议重新考虑目标的用户体验。可能是不同的控件或工作流程

添加了一个 stackblitz，它在控制切换时操纵状态始终为真：

https://stackblitz.com/edit/angular-elks1e?file=src/app/slide-toggle-overview-example.ts

mat-slide-toggle [checked] 属性似乎不起作用

mat-slide-toggle [checked] attribute doesn't seem to work

angular-material

angular