Angular/CSS/Javascript创建可以突破包含div限制的弹出窗口

<div id="popupContent">
  <!-- 弹出窗口内容 -->
</div>

#popupContent {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 400px;
  height: 200px;
  background-color: #fff;
  border: 1px solid #ccc;
  /* 其他样式属性 */
}

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-popup',
  template: `
    <button (click)="openPopup()">打开弹出窗口</button>
    <div #popupContent id="popupContent">
      <!-- 弹出窗口内容 -->
    </div>
  `,
  styles: [/* CSS样式 */]
})
export class PopupComponent {
  @ViewChild('popupContent', { static: true }) popupContent: ElementRef;

  openPopup() {
    this.popupContent.nativeElement.style.display = 'block';
  }

  closePopup() {
    this.popupContent.nativeElement.style.display = 'none';
  }
}

<app-popup></app-popup>