如何自动将溢出的div添加到Angular 2中的相邻Div？

<div #parentDiv>
  <!-- 内容区域 -->
  <div #contentDiv>
    <!-- 内容 -->
  </div>
</div>

<div #overflowDiv *ngIf="checkOverflow(contentDiv)">
  <!-- 溢出的内容 -->
</div>

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

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  @ViewChild('parentDiv') parentDiv: ElementRef;
  @ViewChild('contentDiv') contentDiv: ElementRef;

  checkOverflow(element: ElementRef): boolean {
    return element.nativeElement.scrollHeight > element.nativeElement.clientHeight;
  }
}

:host /deep/ div {
  overflow: hidden;
}

:host /deep/ div#parentDiv {
  position: relative;
}

:host /deep/ div#overflowDiv {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  margin-top: 10px; /* 调整边距以适应溢出的div的高度 */
}