1

我们使用 Creative Cloud Web SDK 和 AngularJS 创建了一个单页应用程序。现在我们遇到了一个问题,即使在编辑器被删除并且状态/视图(我们正在使用 UI-Router)已经更改后,对编辑器元素的引用似乎仍然存在于页面中。如果应用程序随后重新启动编辑器,它会创建新的 DOM 对象和事件侦听器。编辑器中内置的 .close() 函数似乎只是隐藏了编辑器,实际上并没有将其删除。

有没有办法正确关闭编辑器,以便可以在同一页面上安全地重新启动它,而不会由于 DOM 对象数量的增加而导致内存泄漏?

也许将编辑器的元素保留在页面上,但不管发生的其他事情如何都隐藏起来?这样,它不应该在每次需要启动时都创建一个新的编辑器。

感谢您的时间。

4

1 回答 1

1

图像编辑器不应该在每次启动时创建新的 DOM 元素,因此我们可能需要查看一些代码才能弄清楚在这种情况下发生了什么。

示例回购

我有一个使用 Angular、UI Router 和 Creative SDK Image Editor 的简单演示存储库

除了自述文件中的步骤之外,您还需要转到server/index.html并取消注释该<navbar>指令。

用户界面

当你运行应用程序时,你会看到这个(图片下方的解释):

在此处输入图像描述

注意:在这种情况下,导航栏本身与预期的演示无关,但将演示 UI 路由器和图像编辑器共存。

导航栏中的链接是 UI 路由器状态(ui-sref=homeui-sref=modules)。

“编辑图像”按钮启动 Creative SDK 的图像编辑器。您可以在 中找到此代码/client/pre-build/home/

DOM

图像编辑器包含在 id 为 的 div 中avpw_holder

以下是您将在 Chrome Devtools 中看到的关于此 repo 的 home 状态的内容:

<html lang="en">
<head></head>

<body ng-app="Meaniscule" class="ng-scope">
    <navbar>...</navbar> 
    <!-- uiView:  -->
    <div ui-view="" class="container ng-scope">...</div>
    <div id="avpw_holder">...</div>
</body>
</html>

启动和关闭图像编辑器将切换一些处理图像编辑器可见性的类,但不会在 DOM 中创建图像编辑器的新实例。

即使您切换状态也是如此:

在此处输入图像描述

于 2016-01-04T19:18:17.733 回答