Я новый пользователь с функцией Angular Drag & Drop. В Моем Приложении есть много данных в таблице, и у каждой таблицы есть опция выбора, и в опции выбора будут отбрасывать данные из плоского массива. Пожалуйста, смотрите мою структуру данных ниже:
Data
dropdata:any = [
{
name: "Imran",
select_op_val: ["todat", "tomorro"]
},
{
name: "Noor",
select_op_val: ["tomorro", "todat"]
},
{
name: "Salma",
select_op_val: ["tomorro", "todat", "next"]
}
]
drag:any =["today", 'tomorrow', 'next']
Function
onDrop(event: CdkDragDrop<string[], any>) {
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);
}
}
HTML
<ul *ngFor="let arr of dropdata">
<h3>{{arr.name}}</h3>
<li
cdkDropList
#dragTo="cdkDropList"
[cdkDropListData]="arr.select_op_val"
[cdkDropListConnectedTo]="[dragFrom]"
(cdkDropListDropped)="onDrop($event)">
<p *ngFor="let ar of arr.select_op_val" cdkDrag>
<span>::: {{ar}}</span>
</p>
</li>
</ul>
<!--test drop table end-->
<div class="keyword_and_promt_bucket">
<label for="">Keyword and Prompt Bucket</label>
<div class="textarea">
<ul
cdkDropList
class="tag_container"
#dragFrom="cdkDropList"
[cdkDropListData]="drag"
[cdkDropListConnectedTo]="[dragTo]"
(cdkDropListDropped)="onDrop($event)">
<li class="tag" *ngFor="let emailList of drag" cdkDrag>
{{ emailList }}
<span (click)="deleteEmail(emailList)"></span>
</li>
</ul>
</div>
</div>
Когда я перетаскиваю из данных перетаскивания для перетаскивания данных, все работает нормально, но при попытке перетащить из перетащите в dropdata> select_op_val тогда не работает.