angualrjs .pushを使用して同じ位置の画像を複製する方法は？

Question

keypressで画像のコピーを作成しようとしています。問題は、CSSの左上の位置を変更するオブジェクトの配列にコピーをプッシュするときに機能しないことです。私はng-repeatがまだHTMLを読み込んでいると思います。イメージのコピーを作成するための約束などがあり、ng-repeatが新しいオブジェクトを追加した後にCSSを変更する方法はありますか？角度$("#" + id).css({left: left, top: top});

この文句を言わない仕事で

$scope.changed = function (keyevent, item, id) { 
    keyevent.preventDefault(); 
    switch (keyevent.keyCode) { 
     case 68: 
      if (keyevent.ctrlKey) { 
       left = $('#' + id).css("left").slice(0, -2); 
       top = $('#' + id).css("top").slice(0, -2); 

       item.duplicate = true; 
       item = angular.copy(item); 
       itemId = $scope.items.push(item); 
       imagePosition(itemId - 1, left, top); 
      } 
      break; 
    } 

} 
function imagePosition(id, left, top) { 
    $("#" + id).css({left: left, top: top}); 
} 

Answer 1

を使用することができ、角度のためのjQueryであるため、項目）」と呼びます。 新しいオブジェクトを配列にプッシュするたびに、ngがgetStyleを繰り返し呼び出します。私のオブジェクトは、私のCSSスタイルにいくつかの性質を持っています。

<div style="margin-left: 20px;" ng-repeat="item in template.list2"> 


    <img ng-click="setBorder($index,true)" ng-focus="setBorder($index,true)" ng-blur="setBorder($index,false)" 
      ng-style="<%getStyle($index,item)%>" id="<%$index%>" ng-keydown="changed($event,item,$index,this)" tabindex="<%$index%>" ng-show="item.link" 
      src="<% item.link %>" 
      data-drag="<%item.drag%>" 
      data-jqyoui-options="{revert: 'invalid',snap:true,snapTolerance:15,zIndex:999,snapMode:'inner'}" 
      ng-model="template.list2" 
      jqyoui-draggable="{index: <%$index%>,placeholder:true,animate:true}"/> 
</div> 




    $scope.changed = function (keyevent, item, id) { 
     keyevent.preventDefault(); 
     switch (keyevent.keyCode) { 
      case 68: 
       if (keyevent.ctrlKey) { 
        left = parseInt($('#' + id).css("left").slice(0, -2)); 
        top = parseInt($('#' + id).css("top").slice(0, -2)); 
        item.left = left; 
        item.top = top; 
        item.duplicate = true; 
        item = angular.copy(item); 
        $scope.template.list2.push(item); 

        Notification.success("Imagem duplicada com sucesso!"); 

       } 
       break; 
     } 

     $scope.getStyle = function (index, item) { 
      if(item.duplicate) 
      { 
       var top = item.top + 20; 
       var left = item.left +20; 
       var css = { 
        "position":'absolute', 
        "left":+ left + 'px', 
        "top": + top + 'px', 
        "height": item.height + 'px', 
        "width": item.width + 'px', 
        'z-index': 999 
       }; 
      }else{ 
       var css = { 
        "float": 'left', 
        "left": (item.width * index + 5) + "px", 
        "position":'absolute', 
        "height": item.height, 
        "width": item.width, 
        "display": 'inline-block' 
       }; 
      } 

      return css; 
     } 

    } 

Answer 2

それはあなたがNGスタイル= "でgetStyle（$インデックスを使用I私の問題を解決するために

document.getElementById("yourDivId"+id).style.top= top; 
document.getElementById("yourDivId"+id).style.left= left;