第二次使用 ng2-dragula 进入页面时出错

Posted 2023-05-08

【中文标题】第二次使用 ng2-dragula 进入页面时出错

【英文标题】：Getting error second time getting to page with ng2-dragula

【发布时间】：2017-05-02 04:34:52

【问题描述】：

我试图阻止用户移动dragulaService 的第一个元素，代码第一次运行没有任何错误，但是当我离开这个页面然后再次打开它时，我得到了错误。

导致错误的代码：

constructor(public service:SmartTablesService, private dragulaService:DragulaService) 
    dragulaService.setOptions('nested-bag', 
      revertOnSpill: true,
      moves: function (el:any, container:any, handle:any):any 
        if (handle.className === 'sorting-table-title') 
          return false;
         else 
          return true;
        

      
    );

错误是：

error_handler.js:48 例外：未捕获（在承诺中）：错误：./SortTableComponent 类 SortTableComponent_Host 中的错误 - 内联模板：0:0 导致：包名为：“nested-bag”已存在。 错误：包名为：“nested-bag”已经存在。 在 DragulaService.add (http://platform.local:8080/3.chunk.js:1070:19) 在 DragulaService.setOptions (http://platform.local:8080/3.chunk.js:1099:24) 在新的 SortTableComponent (http://platform.local:8080/3.chunk.js:1311:24)

【参考方案1】：

您需要在组件的onDestroy 生命周期中手动销毁nested-bag，因为它不会自动完成：

ngOnDestroy() 
    this.dragulaService.destroy('nested-bag');

【参考方案2】：

最好为每个使用拖放的Angular组件提供唯一的DragulaService，而不是共享公共服务：

@Component(
   ...,
   providers: [DragulaService],
   ...
)
export class MyComponent 
...

Source