Question

我有一个由6个网格组成的网格，该网格依赖于传单阵列。在那个网格内，每个传单都有我的卡片。我想将卡的位置从一个图块更改到另一个图块。

我正在使用ng2-dragula，并已完成所有工作。

我的问题是，当我从一个图块中拖动一张卡时，它将去往另一图块，但是该图块上的当前卡没有占据上一张卡的位置。

我通过添加其中包含导入传单组件的tile组件来实现此目的。然后，我正在使用图块中的文本字段来映射传单列表中传单的位置，如果传单中没有位置，我将用空白卡填充该瓷砖。

请帮助我完成此操作。我非常有义务。还有其他方法吗？我正在尝试使用https://valor-software.com/ng2-dragula/中提到的所有内容，但没有任何效果。

下面是我的代码。

Raster.component.ts

<mat-grid-list>
    <mat-grid-tile *ngFor="let tile of this.tiles" [colspan]="tile.cols" [rowspan]="tile.rows" >
        <mat-card *ngIf="tile.flyer == '-1'">
            .....blank card.....
        </mat-card>
        <mat-card class="flyer-card" *ngIf="tile.flyer !== '-1'" dragula="TILES" [(dragulaModel)]="tiles">
            ......Flyer cards.....
        </mat-card>
    <mat-grid-tile>
</mat-card-list>

Raster.component.ts

MANY_ITEMS = 'MANY_ITEMS';
subs = new Subscription();
public constructor(private dragulaService: DragulaService) {
    dragulaService.createGroup("HANDLES", {
      moves: (el, container, handle) => {
        return handle.className === 'handle';
      }
    });
  }
  assignFlyertoTiles() {
    for (const tile of this.tiles) {
      for (let i = 1; i < this.flyers.length; i++) {
        if (tile.text === this.flyers[i].Pos) {
          tile.flyer = i.toString();
        }
      }
    }
  }

使用ng2-dragula将垫子卡片拖放到垫子网格中

0 个答案: