fix(cdk-experimental/column-resize): Ensure resizable entity is not destroyed before applying min/max update (#24007)

The styleSchedule.scheduleEnd() function will sometimes call the provided callback after the nativeElement has been destroyed. The width of this nativeElement is used in the _apply(Min/Max)WidthPx functions to calculate a width diff. If the nativeElement has already been destroyed, the "current" width of the element is 0 so the column effectively doubles in width even though it technically didn't change. This width change is propagated up to the table which increases its size to account for the increased column width.

If the element has been destroyed, we can just ignore any resize logic pertaining to that old column since it should no longer affect the table's width. A newer version of that entity should make the change if necessary.

(cherry picked from commit 35cdf7c)

Author: biggs0125

src/cdk-experimental/column-resize/resizable.ts

@@ -67,6 +67,7 @@ export abstract class Resizable<HandleComponent extends ResizeOverlayHandle>
   protected abstract readonly changeDetectorRef: ChangeDetectorRef;
 
   private _viewInitialized = false;
+  private _isDestroyed = false;
 
   /** The minimum width to allow the column to be sized to. */
   get minWidthPx(): number {
@@ -100,13 +101,15 @@ export abstract class Resizable<HandleComponent extends ResizeOverlayHandle>
     this._appendInlineHandle();
 
     this.styleScheduler.scheduleEnd(() => {
+      if (this._isDestroyed) return;
       this._viewInitialized = true;
       this._applyMinWidthPx();
       this._applyMaxWidthPx();
     });
   }
 
   ngOnDestroy(): void {
+    this._isDestroyed = true;
     this.destroyed.next();
     this.destroyed.complete();
     this.inlineHandle?.remove();