diff --git a/packages/platform-browser/animations/async/src/async_animation_renderer.ts b/packages/platform-browser/animations/async/src/async_animation_renderer.ts
index 4045f29b71b..c5d172513f8 100644
--- a/packages/platform-browser/animations/async/src/async_animation_renderer.ts
+++ b/packages/platform-browser/animations/async/src/async_animation_renderer.ts
@@ -167,6 +167,16 @@ export class AsyncAnimationRendererFactory implements OnDestroy, RendererFactory
   whenRenderingDone?(): Promise<any> {
     return this.delegate.whenRenderingDone?.() ?? Promise.resolve();
   }
+
+  /**
+   * Used during HMR to clear any cached data about a component.
+   * @param componentId ID of the component that is being replaced.
+   */
+  protected componentReplaced(componentId: string) {
+    // Flush the engine since the renderer destruction waits for animations to be done.
+    this._engine?.flush();
+    (this.delegate as {componentReplaced?: (id: string) => void}).componentReplaced?.(componentId);
+  }
 }
 
 /**