Eu incluí um Plunker aqui: http://plnkr.co/edit/4vqV8toHo0vNjtfICtzI?p=preview
Eu estou tentando adicionar um botão para o DOM e quando clicado deve executar a function vinculada a ele. Neste caso, deve alertar “teste”. Aqui está o código.
controlador
app.controller('MainCtrl', function($scope, $sce) { $scope.trustedHtml = $sce.trustAsHtml(''); $scope.testAlert = function () { alert('testing') }; });
HTML
$sce.trustAsHtml
e ng-bind-html
não são feitos para construir HTML com diretivas. Essa técnica não funcionará.
Isso ocorre porque o angular funciona primeiro compilando e vinculando. Veja a visão geral conceitual para uma boa explicação.
Em resumo, quando você vincular o HTML definido em seu trustAsHtml
, é muito tarde para o angular compilar (e, portanto, entender) a diretiva ng-click
.
Para adicionar dinamicamente HTML, você deve estar olhando para o serviço $compile
(e / ou diretivas). Docs estão aqui .
Desculpe pelo meu inglês ruim.
Para o Angular 1.6.1, encontrei uma solução que funcionou para mim.
modelo:
No controlador:
$scope.trustAsHtml = function(string) { return $sce.trustAsHtml(string); };
Directiva:
.directive('initBind', function($compile) { return { restrict: 'A', link : function (scope, element, attr) { attr.$observe('ngBindHtml',function(){ if(attr.ngBindHtml){ $compile(element[0].children)(scope); } }) } }; })