Question

我在选项卡式ui-router应用程序中使用ngHandsontable。我第一次加载一个标签（状态/路由）并且表格被渲染（我在1个视图中有5-10个表格），性能非常好。然而，一旦我从这个观点转向其他观点（可能会或可能没有更多的动手表），表格的重复性就会大幅下降。不知道问题是什么，但我想也许手表变量没有被清理？事件？存储器？

这就是我使用它的方式（使用jquery masonry插件来堆叠表格）

下面的代码段是ui-view代码的模板：

    <div class="row">
        <div class="col-md-12">
            <div masonry>
                <div class="masonry-brick" ng-repeat="(title, group) in instrumentGroups | orderObjectBy:'sortOrder'" style="" column-width="230">
                    <div class="instrument-group">

                        <hot-table settings="{colHeaders: colHeaders, className: 'htCenter', contextMenu: ['row_above', 'row_below', 'remove_row'], afterChange: hot.afterChange, afterRender: hot.afterRender}" row-headers="false" min-spare-rows="minSpareRows" datarows="group.nodes" >
                            <hot-column data="nodeTitle" title="group.title" width="110" colspan="2" type="grayedOut" read-only></hot-column>
                            <hot-column data="quote" type="'numeric'" width="70" format="group.format"></hot-column>
                            <hot-column data="isIncluded" title="'Use'" width="50" type="'checkbox'" width="50" checked-template="true" unchecked-template="false"></hot-column>
                        </hot-table>

                    </div>
                </div>
            </div>
        </div>
    </div>

所以我正在进行一些挖掘并查看表元素上的chrome dev工具中的“事件监听器”，我可以看到当我在选项卡之间切换并重新绘制表时，数字这些卷轴和visibltychange事件的双倍和三倍......这是预期的吗？

这是在州之间的一些切换之后：

当我在ui-router中的状态之间切换时，如何确保所有这些侦听器（以及可能是其他变量，内存等）都被破坏？

Answer 1

报告为ngHandsonTable Issue#157 。

hotTable的父作用域被销毁时内存泄漏。

您好，   我经常在控制器内部使用指令，后者的范围稍后会被销毁。我不是专家，但似乎在这种情况下，元素没有从DOM中正确删除，导致内存泄漏。   我发现，在vanilla handsontable代码中，您可以在热实例上调用.destroy（）方法将其从DOM中删除，因此我添加了
element.on("$destroy", function() { scope.hotInstance.destroy(); });
在hotTable的“编译”结束时（第584行），它修复了内存泄漏。

我不知道这是否会破坏您代码的其他部分，但我只是想让您知道这里存在潜在问题。

在状态变化

1 个答案:

hotTable的父作用域被销毁时内存泄漏。