Skip to content

Commit 813f66b

Browse files
authored
fix(material/menu): switch internal state to signals (#31934)
Switches the `_isAnimating` state to a signal in order to avoid "changed after checked" errors. Fixes #31933.
1 parent 2789a0b commit 813f66b

File tree

3 files changed

+6
-5
lines changed

3 files changed

+6
-5
lines changed

goldens/material/menu/index.api.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ export class MatMenu implements AfterContentInit, MatMenuPanel<MatMenuItem>, OnI
100100
_handleKeydown(event: KeyboardEvent): void;
101101
hasBackdrop?: boolean;
102102
_hovered(): Observable<MatMenuItem>;
103-
_isAnimating: boolean;
103+
_isAnimating: i0.WritableSignal<boolean>;
104104
// @deprecated
105105
items: QueryList<MatMenuItem>;
106106
lazyContent: MatMenuContent;

src/material/menu/menu.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
[class]="_classList"
66
[class.mat-menu-panel-animations-disabled]="_animationsDisabled"
77
[class.mat-menu-panel-exit-animation]="_panelAnimationState === 'void'"
8-
[class.mat-menu-panel-animating]="_isAnimating"
8+
[class.mat-menu-panel-animating]="_isAnimating()"
99
(click)="closed.emit('click')"
1010
tabindex="-1"
1111
role="menu"

src/material/menu/menu.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import {
2929
AfterRenderRef,
3030
inject,
3131
Injector,
32+
signal,
3233
} from '@angular/core';
3334
import {_IdGenerator, FocusKeyManager, FocusOrigin} from '@angular/cdk/a11y';
3435
import {Direction} from '@angular/cdk/bidi';
@@ -137,7 +138,7 @@ export class MatMenu implements AfterContentInit, MatMenuPanel<MatMenuItem>, OnI
137138
readonly _animationDone = new Subject<'void' | 'enter'>();
138139

139140
/** Whether the menu is animating. */
140-
_isAnimating = false;
141+
_isAnimating = signal(false);
141142

142143
/** Parent menu of the current menu panel. */
143144
parentMenu: MatMenuPanel | undefined;
@@ -461,13 +462,13 @@ export class MatMenu implements AfterContentInit, MatMenuPanel<MatMenuItem>, OnI
461462
this._exitFallbackTimeout = undefined;
462463
}
463464
this._animationDone.next(isExit ? 'void' : 'enter');
464-
this._isAnimating = false;
465+
this._isAnimating.set(false);
465466
}
466467
}
467468

468469
protected _onAnimationStart(state: string) {
469470
if (state === ENTER_ANIMATION || state === EXIT_ANIMATION) {
470-
this._isAnimating = true;
471+
this._isAnimating.set(true);
471472
}
472473
}
473474

0 commit comments

Comments
 (0)