angular - 使用 Angular CDK 将容器拖到不同的 div

Question

我正在尝试使用 Angular Material CDK 将一个 div 拖动到另一个 div，该 div 是原始持有 div 的兄弟。

问题是我可以将它拖动到原始 div 中的任何位置，但它不会超出 div，原始 div 只是随着滚动条而增长。

从下面的代码中你可以看到我正在尝试拖动“example-box”并将其放入“.paper”

<mat-sidenav-container class="example-container">
    <mat-sidenav mode="side" opened class="example-sidebar">
        <!-- below box will not leave this div -->
        <div class="example-box" cdkDrag> 
            Drag me around
          </div>
    </mat-sidenav>
    <mat-sidenav-content class="paper-container">
            <div class="paper">
                <img src="/assets/Page-6.png" class="page-image">
            </div>

    </mat-sidenav-content>
</mat-sidenav-container>