CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-scope
Noor
Noor

Reputation: 20150

Angular remove Element

I have a directive:

app.directive('eventView', function () {
  return {
    restrict: 'E',
    replace:true,
    templateUrl: 'partials/EventView.html',
    controller: 'eventController',
    link: function(scope, element){  
        scope.$on("$destroy",function() {
            element.remove();
        }); 
    }
  }
});

The controller for the directive:

app.controller('eventController', function($scope, $rootScope){
  $scope.removeEvent = function (){
    $scope.$broadcast("$destroy")
  }
});

There are several instances of the same directives in the rootscope. Each directive is a div in which there is a remove button which is bind to the removeEvent method in the controller definition.

The problem is that when a remove button is pressed in one those div(from eventView directive), all the divs are being removed. I only want the current directive from where the destroy is being broadcasted to be removed. I know its because i'm broadcasting $scope.$broadcast("$destroy") but how can I remove only the current scope, is there a predefined method only for that current scope

Upvotes: 0

Views: 414

Answers (1)

harishr
harishr

Reputation: 18055

if you are using ng-repeat then you can use $index as the unique identifier for those div... just update your code like below:

app.directive('eventView', function () {
  return {
    restrict: 'E',
    replace:true,
    templateUrl: 'partials/EventView.html',
    controller: 'eventController',
    link: function(scope, element){  
        scope.$on("$destroy" + identifier,function() {
            element.remove();
        }); 
    },
    scope: {identifier : '@'}
  }
});

and broadcast the event with identifier

app.controller('eventController', function($scope, $rootScope){
  $scope.removeEvent = function (identifier){
    $scope.$broadcast("$destroy" + identifier)
  }
});

if the divs are not part of ng-repeat, then you will need to have some kind of identifier to identify which div to destroy...

Upvotes: 1

Related Questions