angularjs - Self removable directive in angular JS -
i'm trying create application allow me append , destroy repeatable elements, encounter problem.
firstly here directive append elements:
myapp.directive("addwatcher", function($compile){ return function(scope, element, attrs){ element.bind("click", function(){ angular.element(document.getelementbyid('watchers-space')).append($compile("<watcher></watcher>")(scope)); }); }; });
and contains div-button:
<div ng-click="remove()">x</div>
and of course here watcher directive:
myapp.directive('watcher', function() { return { controller: function($scope, $element, $attrs, $transclude) { $scope.remove = function() { $element.remove(); } }, templateurl: 'watcherdirective.html' }; });
the problem can add many of "watchers" can remove last 1 added, , firstly created on page load. missing implementation create opportunity remove every created "watcher" element?
thanks @devqon comment resolved in way:
myapp.directive('watcher', function() { return { scope: true, controller: function($scope, $element, $attrs, $transclude) { $scope.remove = function() { $element.remove(); $scope.$destroy(); } }, templateurl: 'watcherdirective.html' }; });
and works
Comments
Post a Comment