mat-slide-toggle Angular Material toggle programmatically
我正在尝试通过代码
模板
1 | <mat-slide-toggle color="primary" (change)="updateFunc($event)"></mat-slide-toggle> |
ts
1 2 3 4 5 6 | updateFunc(e) { // do some checks to see if can be activated // if can't be activated, don't slide to on e.checked = false; // <--- does not work e.toggle(); // <-- does not work } |
有什么想法吗?
-编辑-
为明确起见,在更改事件之后,按钮被切换为on。我的功能正在运行以进行一些测试。如果测试没有通过,我想将滑块切换回关闭位置。那么,如何在代码中切换按钮(打开或关闭)?这只是在我的代码中使用toggle()方法或在我的代码中取消选中该开关的问题。
https://stackblitz.com/edit/angular-material-edh46h
1 2 3 | <mat-slide-toggle #toggleElement class="example-margin" [checked]="checked" (change)="updateFunc($event)"> Slide me! </mat-slide-toggle> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | @ViewChild("toggleElement") ref: ElementRef; checked: boolean; ngOnInit() { this.checked = true; } updateFunc(e) { const someCondition = true; if (someCondition) { this.ref.checked = false; } } |