.html（）失去角度范围

Question

当我尝试使用jquery＆＃39; s html()将HTML附加到另一个元素时。我失去了ng-click的能力。这是我的代码的粗略描述。例如，我有一个名为testController

的控制器

angular.module("test")
.controller("testController", ["$scope", "$rootScope", 
    function ($scope, $rootScope) {

        var systemMessage = "<div><span><\/span><\/div>";

        $scope.appendHtml = function () {
            systemMessage.find("span").html('<button ng-click="highlightQuestion(id)">go to</button>');
        }

        $scope.highlightQuestion = function (id) {
            console.log(id);
        }

    }]);

HTML呈现后，当我尝试单击按钮时，没有任何反应。我所期望的是它能够访问highlightQuestion函数，因为我的代码systemMessage被附加到由testController控制的div。有人对如何使这项工作有任何想法？谢谢！

Answer 1

您需要使用 $compile 服务。将其注入controller并使用

$scope.appendHtml = function () {
   var span = systemMessage.find("span");
   span.html('<button ng-click="highlightQuestion(id)">go to</button>');
   $compile(span)(scope);
}