如何将模型中的HTML显示为HTML，而不是纯文本

Question

我正在学习Angular并制作一个todo应用程序。创建待办事项使用了一个所见即所得的编辑器（textAngular）。它看起来像这样：

这样可以正常工作并以html格式保存到名为todo.description的ng-model中。但是在显示此待办事项时，描述中的html显示为纯文本。像这样：

描述刚刚绑定到模型

<p class="text-muted">{{todo.description}}</p>

我认为这可以很简单但我没有找到解决方案。我尝试了xmp标签，但这不是我想要的。

如何让说明显示HTML而不显示文字？

Answer 1

<p class="text-muted" ng-bind-html="todo.description"></p>

https://docs.angularjs.org/api/ng/directive/ngBindHtml

Answer 2

您可以使用ngBindHtml来显示您的HTML代码。

＆＃13;

＆＃13;

var app = angular.module('myApp', ['ngSanitize']);

app.controller('myCtrl', ['$scope',
  function($scope) {
    $scope.html = '<b>Test</b><u>Test</u>&lt;HTML';
  }
]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-sanitize.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <span ng-bind-html="html"></span>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

您需要使用$trustAsHTML $sce过滤器（严格上下文转义）