Question

~~我遇到了Sortable，我似乎无法在Plunker中复制。~~

据我所知，Sortable由于变化检测中的某些东西而减慢了很多。慢到无法使用的程度。在视觉上，你可以看到第一个动画，但随着它慢慢完成变化检测，它会非常缓慢地刷新。

~~这是一个模仿我的代码中的东西的plunker。 http://plnkr.co/edit/veH2Y6CkFZ1Dc5jwcPWZ?p=preview~~

<kendo-sortable [data]="columns"
                zone="abcdefg"
                [animation]="true"
                [activeIndex]="activeIndex"
                itemClass="item"
                emptyItemClass="emptyItem"
                activeItemClass="activeItem item">
  <ng-template let-column="item">
    <div class="container" (click)="itemClick(column)">
      <span class="col-name">
          {{column.title || column.field}}
      </span>
      <span class="col-width">{{column.width}}</span>
    </div>
  </ng-template>
</kendo-sortable>

基本上，对话框包含在一个可重用的组件中，我将字符串，模板或组件输入到该组件中。＆＃34;列＆＃34;进入SortableThingComponent输入的数组是来自剑道网格的数组（所有新的＆lt; d列对象）的副本。

~~由于我无法复制减速，我不知道发生了什么。有没有人看到任何有关Sortable的内容或有任何花絮？~~

修改

这是一个包含网格的更新的plunker。我注意到如果我没有网格中的数据，Sortable会更快。可行，但仍然有点慢。网格是虚拟滚动，页面大小为100。

http://plnkr.co/edit/hw8HaKpyZ0lRlVwF2tYp?p=preview

修改2

使用数据更新了最后一个plunker。现在，我正在重新解决这个问题。可以做些什么呢？

Answer 1

现在这是一个解决方法;在打开sortable对话框时，分离网格组件的更改检测器：http://plnkr.co/edit/yy1Z4rWC53vS3xCnxrWT?p=preview

constructor(private changeDetectorRef: ChangeDetectorRef) { }
this.changeDetectorRef.detach(); // when dialog opens
this.changeDetectorRef.reattach(); // when dialog closes

在plunker中，我必须添加一个this.changeDetectorRef.detectChanges（），因为我打开对话框的方式。目前，这是一个很好的解决方法。我可能会使用变化检测策略来提高效率

可分类的性能

1 个答案: