angularjs - AngularJs中的克隆元素(绑定(bind)和全部)

有没有办法在AngularJS中克隆元素并使其绑定(bind)保持完整？

我正在尝试为画廊创建一个图像预加载器。图像从屏幕上载入，然后根据其大小移动到三列之一。因此，实际上确实需要使用JavaScript进行移动，因为直到装载它才应该装入哪个容器，我才知道。

因此，假设我有类似的东西:

<img ng-src="/some/{{image}}" ng-click="doStuff()" />

我希望克隆与之完全相同，同时保留ng-click绑定(bind)。我遇到的问题是，如果我使用 element.clone()。appendTo(someOtherElement)克隆元素，则ng-click绑定(bind)会丢失。当元素插入DOM时，Angular并没有意识到它需要创建新的绑定(bind)。

我一直在尝试$ compile，但是我不知道如何在不手动复制所有属性的情况下使用它来克隆现有元素。

克隆是通过指令完成的，而我仅使用Angular(没有jQuery，不保存Angular中包含的内容)。

最佳答案

您应该执行三个单独的ng-repeats:

<div ng-controller="myController">
     <div class="col1">
          <img ng-src="/some/{{image.src}}" ng-click="doStuff()" ng-repeat="image in imagesForColOne" />
     </div>

     <div class="col2">
          <img ng-src="/some/{{image.src}}" ng-click="doStuff()" ng-repeat="image in imagesForColTwo" />
     </div>

     <div class="col3">
          <img ng-src="/some/{{image.src}}" ng-click="doStuff()" ng-repeat="image in imagesForColThree" />
     </div>

</div>

在 Controller 中，您应该异步加载图像，然后根据其大小将其插入三个阵列之一。

关于angularjs - AngularJs中的克隆元素(绑定(bind)和全部)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19904798/