Angularjs ng bind html中的角度指令未被显示

这是下一个问题

我有一个使用ng bind html注入的html中使用的ng attr标题不起作用，即该标题未在DOM元素中形成，因此悬停时工具提示未形成。以下是我的代码

myApp.controller("MyCtrl",function($scope) {
$scope.tl="this is title";
$scope.level = "<span ng-attr-title='{{tl}}'><b>data</b></span>";
});

问题如图所示，您必须使用$compile服务来实现这一点

JS:

HTML:

此compileHtml指令将根据$scope编译HTML模板。

您必须使用$compile服务来实现这一点

JS:

HTML:

---

此compileHtml指令将根据$scope编译HTML模板。

这是ng bind HTML的正常行为。通常，控制器的代码不应该有HTML标记-将其移动到模板，并使用ng show/ng hide控制其可见性

---

不过，如果需要，您仍然可以这样做，只需使用$compile服务即可。请参见此处的示例：$compile

这是ng bind html的正常行为。通常，控制器的代码不应该有HTML标记-将其移动到模板，并使用ng show/ng hide控制其可见性

---

不过，如果需要，您仍然可以这样做，只需使用$compile服务即可。请参见此处的示例：$compile

ng绑定html将以字符串形式注入html。它不会编译它

检查

您需要自定义指令来编译html并将其注入到元素中

使用以下指令

module.directive('bindHtmlCompile', ['$compile', function ($compile) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            scope.$watch(function () {
                return scope.$eval(attrs.bindHtmlCompile);
            }, function (value) {
                element.html(value);
                $compile(element.contents())(scope);
            });
        }
    };
}]);

---

ng bind html将以字符串形式注入html。它不会编译它

检查

您需要自定义指令来编译html并将其注入到元素中

使用以下指令

module.directive('bindHtmlCompile', ['$compile', function ($compile) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            scope.$watch(function () {
                return scope.$eval(attrs.bindHtmlCompile);
            }, function (value) {
                element.html(value);
                $compile(element.contents())(scope);
            });
        }
    };
}]);

---

我发现其他答案有问题，下面的指令有效，可以与bower一起安装

---

我发现其他答案有问题，下面的指令有效，可以与bower一起安装

---

您正在尝试做ng include所做的事情。记住，要使表达式正常工作，html应该由Angular编译。Angular内部使用$compile服务来实现这一点。您需要为此创建一个指令。您正在尝试执行ng include所执行的操作。记住，要使表达式正常工作，html应该由Angular编译。Angular内部使用$compile服务来实现这一点。您需要为此创建一个指令。

angular.module('bindHtmlExample', ['ngSanitize'])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.val = 'patel';
    $scope.myHTML =
       'I am an <code>HTML</code>string with ' +
       '<a href="#">links!</a> and other <em>stuff</em> {{val}}';
  }]);

module.directive('bindHtmlCompile', ['$compile', function ($compile) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            scope.$watch(function () {
                return scope.$eval(attrs.bindHtmlCompile);
            }, function (value) {
                element.html(value);
                $compile(element.contents())(scope);
            });
        }
    };
}]);