지시어에서 DOM 요소를 찾아 제거하는 방법은 무엇입니까?

Question

나는 내 자신의 태그를 만들고 싶다. 부트 스트랩 타입 어 헤드를 사용하고이 요소에 지시문을 추가하고 선택 작업에서 브로드 캐스트를 수신합니다.

이전에 추가 된 태그 요소를 제거하는 방법을 찾을 수 없습니다. 나는 두 가지 일을 할 수 없다 : id가 알려져 있더라도 my suctom id를 전달하고이 DO 요소를 찾아 제거한다.

제발 도와 드릴까요?

mainApp.directive("tagsManager", ['$compile', function($compile) { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attrs) { 
      console.log("Tags in directive: " + scope.tags); 
      scope.$on('tags.new', function(event, tag) { 
       console.log("New tag is arrived: " + tag.name); 
       var templ = "<div class=\"btn btn-default\" ng-click=\"tagClick($event)\" id=\"tag.name\">tag.name</div>" 
        .replace(/tag.name/, tag.name).replace(/tag.name/, tag.name); 
       var el = angular.element(templ); 
       el.attr("bind-data", tag); 
//    $scope.items = teamSharedObj.teams; 
       $compile(el)(scope); 
       element.after(el); 
      }); 
      scope.tagClick = function (tag) { 
       console.log("Tag: " + tag); 
       // TODO find a way to get id of this element and rempve it 
      } 
     } 
    } 
}]) 

Answer 1

나는 그것이 쉽게 ng-repeat 및 간단한 코드로 대체 할 수있는 당신이 시작 지시어를 제거합니다. 컨트롤러

:

$scope.tags=[]; 
$scope.typeAheadOnSelect = function(tag){ 
    /* perhaps do an ajax update to server here? */ 
    $scope.tags.push(tag);  
} 
/* example of removing from array */ 
$scope.deleteTag=function(tag){ 
    /*server update by ajax, then */ 
    $scope.tags.splice($scope.tags.indexOf(tag), 1); 
} 

마크 업 : 만들어지고 유일한 변형은 데이터 모델에 추가/내부 DOM 요소를 제거 처리하는 각도 것을

<div ng-repeat="tag in tags" ng-click="deleteTag(tag)" id="tag.name">{{tag.name}}</div> 

참고.