You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The CDK Overlay example is missing a crucial event handler. Specifically, when using the ESC key to close the overlay, the parent component's state isn't properly updated, leading to inconsistent behavior:
Current behavior (demonstrated in the StackBlitz):
Closing with ESC requires two clicks to reopen
The solution is to add the detach handler (demonstrated in the StackBlitz):
<ng-templatecdkConnectedOverlay[cdkConnectedOverlayOrigin]="trigger"
[cdkConnectedOverlayOpen]="isOpen"
(detach)="isOpen = false" <!-- Add this line -->><!-- content --></ng-template>
Here is a StackBlitz link that demonstrates both the issue and the working solution with the detach handler. I'm ready to submit a PR implementing these changes once this approach is confirmed.
Documentation Feedback
The CDK Overlay example is missing a crucial event handler. Specifically, when using the
ESC
key to close the overlay, the parent component's state isn't properly updated, leading to inconsistent behavior:Current behavior (demonstrated in the StackBlitz):
The solution is to add the detach handler (demonstrated in the StackBlitz):
Here is a StackBlitz link that demonstrates both the issue and the working solution with the detach handler. I'm ready to submit a PR implementing these changes once this approach is confirmed.
Affected documentation page
https://material.angular.io/cdk/overlay/overview
The text was updated successfully, but these errors were encountered: