用ng2-dragula重新装袋袋

Question

我正在使用ng2-dragula进行一些丰富的排序UI。我让它工作到可以重新排序任何<li>元素。

<div *ngFor="let bag of chest" class='container'>
  <ul [dragula]='"bag-one"' [dragulaModel]='bag'>
    <li *ngFor="let item of bag">{{item}}</li>
  </ul>
</div>

我的chest变量是一个数组数组：[[1, 3, 5], [2, 4, 6]]。所以我可以在2 <li>个div之间自由移动任何container。我想要做的是重新排序整个div本身。

我试过以下但没有运气： <div *ngFor="let bag of chest" class='container2' [dragula]='"bag-one"' [dragulaModel]='chest'>

Answer 1

您应该为每个容器创建动态的有角度的袋子名称。

<div *ngFor="let bag of chest; let i of index" class='container'>
  <ul [dragula]='"bag"+i' [dragulaModel]='bag'>
    <li *ngFor="let item of bag">{{item}}</li>
  </ul>
</div>

代码'"bag"+i'将为每次迭代生成新的包。