如何在视图中呈现包含 HTML 的 Angular 变量

Question

我有一个包含HTML的数据(例如，我有<b>XXXX</b>(，我想将其显示为：

三十三

我希望它在显示时被渲染为粗体。

我该怎么做？

Answer 1

您可以使用

ng-bind-html排他性来做您正在寻找的事情。

var app = angular.module('myApp', ['ngSanitize']);
app.controller('MainCtrl', function ($scope) {
    $scope.text = "<b>XXXX</b>";
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular-sanitize.min.js"></script>
<div ng-app="myApp" ng-controller="MainCtrl">
    <div ng-bind-html="text"></div>
</div>

<小时 />

请注意，您必须在依赖项中包含ngSanitize才能使用它。

在JSFiddle上测试它！

Answer 2

在AngularJS中，您可以使用ng-bind-html来呈现视图上的 html。

它将使您的内容 XXXX 加粗。