在 Angular 中，cdk-overlay-container 是 Overlay 模块使用的一个容器，用于显示过渡效果和实现弹出框等组件。将 cdk-overlay-container 添加到 body 是为了确保 Overlay 可以覆盖整个页面，并且不会受到其他元素的影响。

以下是一些代码示例，说明如何手动将 cdk-overlay-container 添加到 body：

app.component.html：

app.component.ts：

import { Component, Injector, ViewContainerRef } from '@angular/core';
import { Overlay, OverlayConfig, OverlayContainer } from '@angular/cdk/overlay';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(private overlay: Overlay, private injector: Injector, private overlayContainer: OverlayContainer) { }

  showOverlay() {
    const overlayRef = this.overlay.create(this.getOverlayConfig());
    const overlayPortal = new TemplatePortal(this.overlayTemplate, this.viewContainerRef);
    overlayRef.attach(overlayPortal);
  }

  private getOverlayConfig(): OverlayConfig {
    const positionStrategy = this.overlay.position().global().centerHorizontally().centerVertically();
    const overlayConfig = new OverlayConfig({
      positionStrategy,
      hasBackdrop: true,
      scrollStrategy: this.overlay.scrollStrategies.block(),
      panelClass: 'my-overlay-container'
    });
    return overlayConfig;
  }

  get overlayTemplate(): TemplateRef {
    return this.injector.get(TemplateRef);
  }

  get viewContainerRef(): ViewContainerRef {
    return this.injector.get(ViewContainerRef);
  }

}

在上面的代码中，我们通过 Overlay 模块创建了一个 Overlay，并使用 TemplatePortal 将模板渲染到 Overlay 上。需要注意的是，在 getOverlayConfig 方法中，我们指定了一个 CSS 类名 my-overlay-container，这个类