Javascript 通过单击angularJS删除元素

我正在尝试使用指令删除一个元素

我找到了一个有效的例子

我尝试添加一个新元素，并将其作为

var-app=angular.module（'myApp'，[]）；
app.directive（'removeOnClick'，function（）{
返回{
链接：功能（范围、elt、属性）{
scope.remove=函数（）{
警报（“此处”）；
html（“”）；
};
英语附加语（“”）；
}
}
});

但是这个

一个不起作用

---

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

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

试试这个

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>');
        }
    }
});

var-app=angular.module（'myApp'，[]）；
app.directive（'removeOnClick'，function（）{
返回{
链接：功能（范围、elt、属性）{
scope.remove=函数（）{
警报（“此处”）；
html（“”）；
};
elt.bind（'click'，function（）{
警报（“此处”）；
html（“”）；
});
英语附加语（“”）；
}
}
});

对于插入的任何包含角度指令的html，您需要使用

$compile

：

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);
        }
    }
});

app.directive（'removeOnClick'，function（$compile）{
返回{
链接：功能（范围、elt、属性）{
scope.remove=函数（）{
警报（“此处”）；
html（“”）；
};
变量链接=$compile（“”）（范围）
elt.append（link）；
}
}
});

还请注意，大多数情况下，您可以通过管理模型数据和删除数据并让angular管理dom来执行这种删除。例如，在一个

ng repeat

中删除一行，您可以使用一个按钮从数据数组中删除该项，然后angular将为您从dom中删除该项

---

我想他希望执行

elt.append（）

。您只需调用

ng单击元素上的
即可运行
remove（）
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);
        }
    }
});