Javascript ng模型在$（element.clone（）之后不起作用

我有一个指令，可以在拖放时克隆对象

app.directive('ironplayDraggableBox', ['$compile', function($compile) {
  return {
    restrict:'A',
    link: function(scope, element, attrs) {
      $(element).draggable({
        connectToSortable: ".preview",
        helper: function(){
          $new_el = $(this).clone();
          return $compile($new_el)(scope);
        },
        handle: ".drag",
      });
    }
  };
}]);

但是当我用这样的HTML代码拖动DOM元素时

<input type="text" ng-model="align">{{align}}

{{align}

ng型号

完全停止工作

您能建议如何使用内部的角度指令实现适当的dom元素克隆吗

以下是完整的代码：

---

plunker中的目标是让文本对齐选择工作。

问题是您的助手克隆不是最后放在HTML中的克隆。您可以从可排序元素的

stop

事件中获取最后一个元素，并对其进行编译（您需要向该指令注入$compile）：

为了使模型生效，您还需要将h3从类更改为ng类

<h3 ng-class="align" contenteditable="true">Hello</h3>

你好 还请注意，您可以使用新的作用域创建可拖动元素，以便每个元素都具有不同的状态

看看这个

<h3 ng-class="align" contenteditable="true">Hello</h3>