angularjs - 如何在 angularjs 模板中显示 html 而不是字符串？

Question

我的范围中有一个变量:

$scope.myvar = "Hello<br><br>World"

在我的模板中，我使用:

<div>{{myvar}}</div>

问题是 myvar 显示文字文本，而我希望它显示换行符。这该怎么做？请注意，我想让它这样，如果我将来用其他 HTML 更新 myvar，那么页面上显示的应该是“编译”的 html，而不是其中包含 html 标签的文字字符串。

Answer 1

您可以使用 ngBindHtml 为了那个原因。
请记住，由于 Angular 的 Strict Conceptual Escaping 需要对内容进行清理(使用附加模块 ngSanitize )或明确“trustedAsHtml”(使用 $sce.trustAsHtml() )。后者应该只用于你的内容了解是安全的(例如，没有用户定义)，无论如何都不推荐。

注: ngSanitize是一个非核心模块，应单独包含:
<script src=".../angular.min.js"></script> <script src=".../angular-sanitize.min.js"></script>
例子:

/* Using ngSanitize */
angular.module('app', ['ngSanitize'])
.controller('myCtrl', function ($scope) {
    $scope.myHtml = 'Hello<br /><br />world !';
});

/* Using $sce.trustAsHtml() */
angular.module('app', [])
.controller('myCtrl', function ($sce, $scope) {
    $scope.myHtml = $sce.trustAsHtml('Hello<br /><br />world !');
});

请注意 ngSanitize将过滤“不适当”的内容，而 $sce.trustAsHtml将允许任何事情。

另见 short demo .