엘리먼트를 제거하면 ng-repeat 코멘트가 남음

Question

아이템을 나열하는 인벤토리를 만들었으며 아이템을 클릭하면 유사한 아이템을 볼 수 있습니다. 사용자가 그 목록이 닫힌 후 내가 유사한 항목 요소를 제거하면 ... 문제가 발생

<!-- ngRepeat: item in category.items(3606) | orderBy:'sort_order' --> 
<!-- end ngRepeat: item in category.items(3606) | orderBy:'sort_order' --> 

를 뒤에 잎 범위에서, 각도가 NG-반복 재현 경우 해당 항목이 다른 업데이트 될 때마다 때문에 표시합니다. 나는 그 요소를 잘못 파괴하고 있는가?

app.directive('similar', function($rootScope, $compile, $templateCache, Item, Allo){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs) { 

      var unqId = _.uniqueId('similar'); 

      elem.on('click', function(){ 

       // if user closes the list of similar items, destroy the contents 
       if (elem.hasClass('glyphicon-upload')) { 
        elem.removeClass('glyphicon-upload'); 
        angular.element('.'+ unqId).remove(); 
        return; 
       } 

       elem.addClass('glyphicon-upload'); 

       var itemId = scope.$parent.item.id; 
       var similars = scope.similars[itemId]; 

       if (similars) { 

        var row = $templateCache.get('inventory/views/_row.htm'); 

        var html = $compile('<tr class="'+ unqId +'" ng-repeat="item in category.items('+ similars +') | orderBy:\'sort_order\'">'+ row +'</tr>')(scope); 

        elem.parents('tr').after(html); 
       } 
      }); 
     } 
    }; 
}); 

Answer 1

먼저이 정렬의 DOM 조작은 지시문에서 불필요합니다. similar_items 마찬가지로 비어있을 때 그럼 당신은 당신의 범위에 그것을 설정해야합니다의 table가 숨겨집니다

<table similar ng-hide="similar_items.length == 0"> 
    <tr ng-repeat="item in similar_items" ...> 
    <!-- contents of inventory/views/_row.htm here -->  
    </tr> 
</table> 

, 빈 <tr>의 세트 : 당신이 가장 가능성이 당신 같은 뭔가 원하는 것을 얻을 수 있습니다 - 각도는 범위에서 similar_items 속성에 결합하고, 옳은 일이 <tr>을 WRT 할 것

elem.on('click', function() { 
    ... 
    var itemId = scope.$parent.item.id; 
    var similars = scope.similars[itemId]; 
    scope.similar_items = category.items(similars); 
}); 

당신은 모두 수동으로 DOM을 조작 할 필요가 없습니다. 숨겨진 요소에 클래스가 운동 :)로 남겨 봉사 할 것입니다 무슨 목적으로하지만 당신은 유사한 메커니즘을 통해 glyphicon-upload 클래스를 추가/제거 할 수

이 왼쪽 숨김 코멘트 문제를 해결할 수 있습니다 그건; 다른 상황 (애니메이션이 완료된 후 스코프의 모델 수정)에서 같은 문제가 발생했지만 아직 해결하지 못했습니다.