Question

我正在尝试使用指令

删除元素

我尝试追加一个新元素并将其作为 http://jsfiddle.net/qDhT9/140

var app = angular.module('myApp', []);
    app.directive('removeOnClick', function() {
        return {
            link: function(scope, elt, attrs) {
                scope.remove = function() {
                    alert('here');
                    elt.html('');
                };
                elt.append('<a href class="close" style="float:right;padding-right:0.3em" ng-click="remove()">&times;</a>');
            }
        }
    });

但是这个

一个不起作用。

为什么以及如何使第二个工作。

Answer 1

您需要对包含angular指令的任何html使用<configuration> <config> <add key="repositoryPath" value="SomeDirectory\Packages" /> </config> </configuration>：

$compile

另请注意，大多数情况下，您可以通过管理模型数据并删除数据来进行此类删除，并让角度管理dom。例如，删除app.directive('removeOnClick', function($compile) { return { link: function(scope, elt, attrs) { scope.remove = function() { alert('here'); elt.html(''); }; var link = $compile('<a href class="close" ng-click="remove()">LINK</a>')(scope) elt.append(link); } } });中的一行，您将使用一个按钮从数据数组中删除该项，然后使用angular将其从dom中移除

的 DEMO

Answer 2

您需要将函数绑定到元素以触发删除函数

试试这个，

var app = angular.module('myApp', []);
app.directive('removeOnClick', function() {
    return {
        link: function(scope, elt, attrs) {
            scope.remove = function() {
                alert('here');
                elt.html('');
            };
              elt.bind('click', function() {

                alert('here');
                elt.html('');
      });
            elt.append('<a href class="close" style="float:right;padding-right:0.3em" ng-click="remove()">&times;</a>');
        }
    }
});

通过单击角度删除元素

2 个答案: