我试图使容器“建筑物”在内部移动“地块”,而容器“地块”在内部也包含“地板”。我必须能够将“地块”拖放到“建筑物”中,并将“地板”移到“地块”中。在“地段”外面一定不能有“地板”。
这是我的数组:
this.buildings = [
{ id: 1, name: "building1", lots: [
{ id: 1, name: "lot1", building_id: 2, floors: [
{ id: 1, name: "floor1", lot_id: 1 },
{ id: 2, name: "floor2", lot_id: 1 },
{ id: 3, name: "floor3", lot_id: 1 }] },
{ id: 2, name: "lot2", building_id: 1, floors: [
{ id: 1, name: "floor1", lot_id: 2 },
{ id: 2, name: "floor2", lot_id: 2 },
{ id: 3, name: "floor3", lot_id: 2 }] }] },
{ id: 2, name: "building2", lots: [
{ id: 1, name: "lot1b", building_id: 2, floors: [
{ id: 1, name: "floor1b", lot_id: 1 },
{ id: 2, name: "floor2b", lot_id: 1 },
{ id: 3, name: "floor3b", lot_id: 1 }] },
{ id: 2, name: "lot2b", building_id: 2, floors: [
{ id: 1, name: "floor1b", lot_id: 2 },
{ id: 2, name: "floor2b", lot_id: 2 },
{ id: 3, name: "floor3b", lot_id: 2 }] }] }
]
这是我的HTML:
<ion-card *ngFor="let building of buildings">
<ion-card-title>
{{building.name}}
</ion-card-title>
<ion-card-content [dragula]='"bag-one"' [(dragulaModel)]="building.lots">
<ion-card *ngFor="let lot of building.lots">
<ion-card-title>
{{lot.name}}
</ion-card-title>
<ion-card-content [dragula]='"bag"' [(dragulaModel)]="lot.floors">
<ion-card *ngFor="let floor of lot.floors">
<ion-card-title>
{{floor.name}}
</ion-card-title>
</ion-card>
</ion-card-content>
</ion-card>
</ion-card-content>
</ion-card>
使用此代码,可以将“地块”移到“建筑物”中,但无法在“地块”内重新排列“地板”。