我从我的数据库中得到一个HTML-String，我想通过 ng-bind-html将它插入到我的AngularJs应用程序中.我是这样做的:
Html:
<div ng-bind-html="myBindHtml"></div>
JavaScript:如下所示:
$scope.myBindHtml = $sce.trustAsHtml(htmlStringToInsert);
我的HTML(我想要插入的)如下所示:
<button ng-click="testClickEvent()">TestButton</button>个
插入物工作正常.
现在，我编写了一个按钮应该调用的函数(TestClickEvent).这只是将一个字符串输出到控制台.
但这一部分不起作用.我想从我插入的HTML到这个函数没有绑定.有什么方法可以调用我的函数吗？
只有在Angular 上下文中运行Angular 代码时，它才会执行.当您使用ng-bind-htmlITS在Angular 上下文/作用域之外生成时，因此像ng-click这样的Angular 事件不起作用，您需要依赖像onclick这样的纯JS事件，因此避免这些场景，由于解决方案的复杂性，直接在Angular 上对它们进行编码！
当需要Angular 事件时，我们可以避免ng-bind-html，并且我们需要在前端直接编码它们，而不是从数据库或其他方法中输入
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($sce, $scope) {
$scope.items = [];
for (var i = 1; i <= 2; i++) {
$scope.items.push({
description: $sce.trustAsHtml('<h2 onclick="console.log(\'hello\')">with onclick item ' + i + '</h2>')
});
};
$scope.items2 = [];
for (var i = 1; i <= 2; i++) {
$scope.items.push({
description: $sce.trustAsHtml('<h2 ng-click="console.log(\'hello\')"> with ng-click item ' + i + '</h2>')
});
};
});<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js" integrity="sha512-KZmyTq3PLx9EZl0RHShHQuXtrvdJ+m35tuOiwlcZfs/rE7NZv29ygNA8SFCkMXTnYZQK2OX0Gm2qKGfvWEtRXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<div ng-app="myApp">
<div ng-controller="myCtrl">
<div>
<div ng-repeat="item in items" ng-bind-html="item.description"></div>
</div>
<hr />
<div>
<div ng-repeat="item in items2" ng-bind-html="item.description"></div>
</div>
</div>
</div>