AngularJS拖放可编辑

Question

我是 AngularJS 的新手，请从核心层面指导我。

我的要求是将项目（源）拖放到创建动态树结构（目标）中。请找到随附的屏幕截图。

在源代码中，我有需要拖动以形成动态树结构的项目列表，其中树中的所有节点都应该是可编辑的。

Ex 1：树结构的创建/编辑

Step1) 从源中选择一个项目并拖动到目标

Step2) 在目标端产品目录 将使用默认名称和时间戳创建。将在产品目录下创建 产品。将在产品 items 下创建。如屏幕截图所示，最终选定的项目将被放置在项目下。此类别下可以添加多个项目。

仅供参考：如果在产品级别删除所选项目，则会在同一产品目录下隐式创建另一个产品结构。

请告诉我推进它的方法。

谢谢

vij

Answer 1

使用 HTML5 Content Editable 属性随时随地编辑页面内容并确保对其进行控制（例如：管理员模式）

在您的角度控制器中使用控制标志来允许用户编辑内容。

对于拖放，您必须使用 3rd 方插件，并且有大量可用的开源插件。

要使内容可编辑，

<p contenteditable="true">You can edit me!</p>

为了 Angular，

<p contenteditable="isAdminMode">You can edit me!</p>

根据情况设置$scope.isAdminMode = true || false。

Answer 2

问题已解决。实际上，我们创建了默认的树结构，我们在其中添加了在每个子节点和父节点创建节点的选项以及删除选项。