如何在javascript中调用点击功能，例如ng-click圆圈(SVG元素)

Question

我在JS文件中有一些html文本，它再次返回到html页面。 htmltext包含一些圆形svg元素，当我们从API检索时，该元素可以正确显示。单击圆圈时，我想在同一个js文件中调用一个js函数。我正在尝试使用 ng-单击但它不起作用

htmlText += '<circle ng-click="getUrl()" cx="9.5" cy="9.5" stroke-width="2" stroke="'+statsObj[s].color+'" fill-opacity="0" r="8.00" title="" style="opacity: 1;" data-original-title="'+statsObj[s].state+'" ng-click="getUrl()"></circle>';

语法有问题还是我们可以用其他方式实现？ 提前谢谢。

Answer 1

这是因为如果你需要使用像ng-click这样的角度指令，则需要编译html字符串。您可以通过创建指令来执行此操作。

我从这里接受了指令 并在 Angular js 中创建了一个 plunkr ： 调用 $sce.trustAsHtml(( 字符串中的

函数https://plnkr.co/edit/HZr2Bje2YBoY2luvB6zC?p=info 供您参考。

app.directive('compileTemplate', function($compile, $parse) {
return {
restrict: 'A',
link: function(scope, element, attr) {
var parsed = $parse(attr.ngBindHtml);
//Recompile if the template changes
scope.$watch(
function() { 
return (parsed(scope) || '').toString(); 
}, 
function() {
$compile(element, null, -9999)(scope);
}
);
}
};
});

您可能还希望使用$sce.trustAsHtml在主页中嵌入html。

希望这有帮助！