如何从ngModel呈现HTML标签？

Question

我正在使用AngularJS将JS变量绑定到HTML内容，并且工作正常。

JS

var app = angular.module("Tabs", [])
  .controller("TabsController", ['$scope', function($scope){
    $scope.events = my_JS_object;
  })

的HTML

<div>{{events.test}}</div>

只要my_JS_object.test是简单的字符串（如）"Hello World"，它就可以工作，但是一旦我尝试将HTML标记放在其中（如），Hello <b>World</b>它就不会将标记用作HTML元素，而是用作简单文本。这是有道理的，只有我不知道如何使HTML标记起作用。

Answer 1

正如 Angular 文档所述，您可以使用内置的ng-bind-html指令来评估模型字符串并将生成的 HTML 插入到元素中。

示例：如果您的模型值如下：

$scope.myHTML =
 'I am an <code>HTML</code>string with ' +
 '<a href="#">links!</a> and other <em>stuff</em>';

使用ng-bind-html类似：

<p ng-bind-html="myHTML"></p>

有关详细信息，请访问：https://docs.angularjs.org/api/ng/directive/ngBindHtml

注意：不要忘记在您的应用程序中注入ngSanitize服务。