8

バインディングをそのままにして、AngularJS の要素を複製する方法はありますか?

ギャラリー用の画像プリローダーを作成しようとしています。画像は画面外に読み込まれ、サイズに応じて 3 つの列のいずれかに移動されます。したがって、実際にはJavaScriptで移動する必要があります。ロードされるまで、どのコンテナに入るべきかわからないからです。

だから私は次のようなものを持っていると仮定します:

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

ng-clickバインディングをそのままにして、クローンをこれと同一にしたい。私が遭遇している問題は、element.clone().appendTo(someOtherElement)を使用して要素を複製すると、途中で ng-click バインディングが失われることです。要素が DOM に挿入されると、Angular は新しいバインディングを作成する必要があることを認識しません。

$compile を試してみましたが、すべての属性を手動でコピーせずに既存の要素を複製する方法がわかりません。

複製はディレクティブによって行われ、Angular のみを使用しています (Angular に含まれるものを保存する jQuery はありません)。

4

1 に答える 1

1

3 つの個別の ng-repeat を実行する必要があります。

<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>

コントローラーでは、画像を非同期的にロードし、サイズに応じて 3 つの配列のいずれかにプッシュする必要があります。

于 2016-07-29T04:47:00.603 に答える