拖放角度材料的问题

Question

我在从 api 拖放时遇到了角度材料问题我无法拖放。当我只使用静态数组时它工作正常 这是发生了什么： enter image description here 我的删除功能是：

  onDrop(event: CdkDragDrop<GetRoles[]>) {
if (event.previousContainer === event.container) {
  moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
} else {
  transferArrayItem(event.previousContainer.data,
    event.container.data,
    event.previousIndex,
    event.currentIndex);
}


  }

我的代码是：

<div class="list" cdkDropList #availableList="cdkDropList" [cdkDropListData]="getRoles" [cdkDropListConnectedTo]="[assignedList]" class="role-list" (cdkDropListDropped)="onDrop($event)">
        <ul>
            <h6 class="text-center ">Available Roles</h6>
         
               
                    <li class="text-center " *ngFor="let act of role" cdkDrag>
                        <span> {{ act.role }} </span>
                    </li>
                
            
        </ul>
    </div>
    <div class="list" cdkDropList #assignedList="cdkDropList" [cdkDropListData]="subUser" [cdkDropListConnectedTo]="availableList" class="role-list" (cdkDropListDropped)="onDrop($event)">
        <ul>
            <h6 class="text-center ">assigned Roles</h6>
            <div *ngFor="let act of subUser">
                    <li class="text-center " cdkDrag>
                        {{ act.key }}
                    </li>
            </div>

        </ul>
    </div>