无法将选项卡组中的元素拖放到另一个选项卡上

Question

我正在使用标签组来呈现一堆数据。每个选项卡都包含一组可拖动的元素。我正在尝试允许拖放到非活动标签标签上，但遇到了困难。尽管标签已被赋予“可放置”属性，但它们似乎并未注册为可放置区域。

<mat-tab-group style="height:600px;">
    <mat-tab *ngFor="let tech of selectedTerritory?.Technicians">
      <ng-template mat-tab-label droppable
        [dropScope]="isDropAllowed"
        [dragOverClass]="'drag-target-border'"
        (onDrop)="onServiceCallForwarded($event, tech.Id)">
          {{tech.Name}}
      </ng-template>
...
</mat-tab-group>

这根本不可能吗？如果可能，我错过了什么？

谢谢。

Answer 1

啊哈！我整理了一下。 我需要在 ng-template 中添加一个包含 droppable 属性的 div。