Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

bug(mat-slide-toggle): Use confirm dialog with slide toggle, if cancel the dialog, should not change the state

See original GitHub issue

Reproduction

Use StackBlitz to reproduce your issue: https://stackblitz.com/edit/angular-dchf74 Steps to reproduce:

Click the slide toggle and select cancel the confirm dialog
The state of the toggle still gets changed

After some research, (ngModelChange)="onHide()" will have the old value before toggling. Resetting value in the function body does NOT work. The implementation of slide-toggle is not something like slideToggleValue = !slideToggleValue?

event.stopPropogation() does NOT work also.

Wondering if there could be a workaround. Many thanks.

Expected Behavior

If click cancel, the state of the toggle should remain the old value.

Actual Behavior

If click cancel, the state of the toggle still gets changed

Environment

Angular:
CDK/Material:^9.0.0
Browser(s): Chrome
Operating System (e.g. Windows, macOS, Ubuntu): macOS

Issue Analytics

State:
Created 3 years ago
Reactions:1
Comments:5 (2 by maintainers)

Top GitHub Comments

1reaction

qiufengyucommented, May 29, 2020

Thank you Paul. This is exactly what I want.

0reactions

angular-automatic-lock-bot[bot]commented, Jun 29, 2020

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

Top Results From Across the Web

mat-slide-toggle shouldn't change it's state when I click cancel ...

When I click cancel in that confirmation window, still the toggle changes to unchecked, which shouldn't happen. It should stay in the same...

Slide toggle | Angular Material

Used to set the aria-labelledby attribute on the underlying input element. @Input(). checked: boolean. Whether the slide-toggle element is checked or not.

Mat Slide Toggle Example - StackBlitz

Basic slide-toggles.

mat-slide-toggle in Angular material - GeeksforGeeks

In order to install it, we need to have angular installed in our project, once you have it you can enter the below...

Angular Material Slide Toggle - ConcretePage.com

To use slide toggle, our Angular application must load HammerJS. Find the sample code to use <mat-slide-toggle> with formControl and change ...