angularjs - 如何对受信任的 html 使用 {{{}}} 语法？-6ren

angularjs - 如何对受信任的 html 使用 {{{}}} 语法？

转载作者：行者123 更新时间：2023-12-04 20:39:52

Handlebars {{expression}}表单 HTML 转义值返回，而其 {{{expression}}}形式没有。有什么办法可以将此功能添加到AngualarJS模板中，以便我们可以使用{{expression}}用于常规 sanitizer 输出和 {{{expression}}}对于可信的、非转义的 HTML 表达式？

顺便说一下，我熟悉ng-bind-html指示。

最佳答案

答案 : 最简洁的答案是不。我从来没有遇到过这样的配置。您无法让 {{{}}} 在 Angular 中工作。

有用的解决方法 :在不使用 ng-bind-html 指令的情况下，不可能通过范围将未转义/未净化的 HTML 放入 View 中。您可以向 Controller 添加一个辅助函数或添加一个过滤器，这可能会使使用 ng-bind-html ( Plunk here ) 更容易一些，但您似乎仍然需要 ng-bind-html:

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

app.controller('MyController', function($scope, $sce) {
  $scope.someHtmlContent = "Label: <input name='test'>";

  $scope.h = function(html) {
    return $sce.trustAsHtml(html);
  };
}); 

app.filter('trustAsHtml', function($sce) { return $sce.trustAsHtml; });

然后你会像这样使用它:

<body ng-controller="MyController">
  <div ng-bind-html="someHtmlContent | trustAsHtml"> 
  </div>

  <div ng-bind-html="h(someHtmlContent)"> 
  </div>
</body>

关于angularjs - 如何对受信任的 html 使用 {{{}}} 语法？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28383624/