0

我正在尝试将大组件拆分为较小的组件。我已经实现了 Angular Material 的拖放功能，它通过哈希标记连接两个列表。问题是现在可以拖动的列表和可以放置项目的列表是分开的，因为每个都在不同的组件中。我的问题是如何连接这两个列表以再次获得功能？我没有询问任何代码实现，而只是询问将值传递给这两个组件之间的哈希元素引用。 在此处输入图像描述

代码：子组件 1 ([cdkDropListConnectedTo]="[doneList]")：

    <div class="msgList"
    cdkDropList #todoList="cdkDropList" [cdkDropListData]="messagesArray" [cdkDropListConnectedTo]="[doneList]"
    infiniteScroll [infiniteScrollDistance]="2" [infiniteScrollThrottle]="50"(scrolled)="onScroll()" [scrollWindow]="false">

子组件 2 ([cdkDropListConnectedTo]="[todoList]"):

     <a mat-list-item class="navItem" (click)="onContainerChange(enumMessageContainer.DELETED_MESSAGES)"
           cdkDropList #doneList="cdkDropList"
           [cdkDropListData]="messagesMovedToDelete" [cdkDropListConnectedTo]="[todoList]"
           (cdkDropListDropped)="dropAndDelete($event)">
            <mat-icon>delete</mat-icon>
            <span class="nav-caption">Trash</span>
        </a>
4

0 回答 0