Question

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

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

也许保留页面上的编辑器元素，但不管其他所有内容是什么都隐藏起来？这样，每次需要启动时都不应该创建新的编辑器。

感谢您的时间。

Answer 1

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

示例repo

我有simple demo repo using Angular, UI Router, and the Creative SDK Image Editor。

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

UI

当您运行该应用时，您会看到此信息（图片下方的说明）：

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

导航栏中的链接是UI路由器状态（ui-sref=home和ui-sref=modules）。

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

中找到相应的代码

DOM

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

以下是您将在Chrome Devtools中看到的此回购的主页状态：

<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中创建图像编辑器的新实例。

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

正确关闭Adobe的Creative Cloud Web SDK

1 个答案:

示例repo

UI

DOM