fix(cdk/menu): not responding to position changes (#30234)

Fixes that the CDK menu wasn't updating its position strategy after the first open.

Fixes #30145.

Author: crisbeto

src/cdk/menu/menu-trigger.ts

@@ -12,8 +12,10 @@ import {
   ElementRef,
   inject,
   NgZone,
+  OnChanges,
   OnDestroy,
   Renderer2,
+  SimpleChanges,
 } from '@angular/core';
 import {InputModalityDetector} from '@angular/cdk/a11y';
 import {Directionality} from '@angular/cdk/bidi';
@@ -72,7 +74,7 @@ import {eventDispatchesNativeClick} from './event-detection';
     PARENT_OR_NEW_MENU_STACK_PROVIDER,
   ],
 })
-export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnDestroy {
+export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnChanges, OnDestroy {
   private readonly _elementRef: ElementRef<HTMLElement> = inject(ElementRef);
   private readonly _overlay = inject(Overlay);
   private readonly _ngZone = inject(NgZone);
@@ -133,6 +135,12 @@ export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnDestroy {
     return this.childMenu;
   }
 
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes['menuPosition'] && this.overlayRef) {
+      this.overlayRef.updatePositionStrategy(this._getOverlayPositionStrategy());
+    }
+  }
+
   override ngOnDestroy(): void {
     this._cleanupMouseenter();
     super.ngOnDestroy();

tools/public_api_guard/cdk/menu.md

@@ -18,12 +18,14 @@ import { InjectionToken } from '@angular/core';
 import { Injector } from '@angular/core';
 import { NgZone } from '@angular/core';
 import { Observable } from 'rxjs';
+import { OnChanges } from '@angular/core';
 import { OnDestroy } from '@angular/core';
 import { Optional } from '@angular/core';
 import { OverlayRef } from '@angular/cdk/overlay';
 import { QueryList } from '@angular/core';
 import { Renderer2 } from '@angular/core';
 import { ScrollStrategy } from '@angular/cdk/overlay';
+import { SimpleChanges } from '@angular/core';
 import { Subject } from 'rxjs';
 import { TemplatePortal } from '@angular/cdk/portal';
 import { TemplateRef } from '@angular/core';
@@ -202,12 +204,14 @@ export class CdkMenuModule {
 }
 
 // @public
-export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnDestroy {
+export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnChanges, OnDestroy {
     constructor();
     close(): void;
     getMenu(): Menu | undefined;
     _handleClick(): void;
     // (undocumented)
+    ngOnChanges(changes: SimpleChanges): void;
+    // (undocumented)
     ngOnDestroy(): void;
     open(): void;
     _setHasFocus(hasFocus: boolean): void;