javascript – 如何使用ng2-dragula拖放到多个Angular2组件

我有一个Angular2组件,使用ng2-dragula进行拖放,如下所示：

@Component({
  selector: 'my-comp',directives: [
    Dragula
  ],viewProviders: [
    DragulaService
  ],template: `
    <div class="my-div">
      <div *ngFor="#item of items" [dragula]='"card-bag"' [dragulaModel]='items'>
      ...
      </div>
    </div>
  `
})

我的问题：如果我创建了多个“my-comp”组件,“card-bag”中的项目不能拖放这些组件,尽管它们具有相同的包名称.这些项目只能在其拥有的组件内拖放.

我们是否有任何跨组件拖放的配置,或者这是ng2-dragula限制？

谢谢.

解决方法

如果您没有使用[dragulaModel],那么只要在top / root组件中设置viewProviders：[DragulaService]一次,嵌套组件之间的拖放效果就会很好.

切记不要在其他组件中设置viewProviders：[DragulaService],因为它为每个组件创建新实例.

编辑：最近我使用ng2-dnd npm包实现了给定的场景.它比ng2-dragula更好,并提供简单的物体传递和其他东西.它可能会解决您的问题.