Question

在我的应用中，我使用的是table和ng-repeat。我正在渲染我的数据，其中一列是在以下的帮助下渲染的：

<div class="cell" data-ng-bind-html="article.Content">
</div>

但我有一个问题，如果我有以下内容：

<div class="page-wrap">123</div>

它破坏了我的整个风格（因为页面也有页面包装）。

渲染html是否真实，但没有渲染样式和CSS风格？怎么样？

像：

<div>123</div>

Answer 1

我相信你所说的是article.Content实际上包含HTML，并且Angular正在删除所有HTML标记。

您的代码接近于为您提供所需内容，但您需要使用$ sce服务将内容标记为HTML，并将其标记为“安全”。一种简单的方法是使用此过滤器。

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

然后使用此过滤器删除类：

app.filter('stripClasses', function() {
  return function(str) {
    return str.replace(/class=['"].*["']/, '');
  }
});

.replace（）函数从内容中删除任何class="whatever"，我认为这就是你想要的。

更新：同样，这可用于删除任何内联样式：

app.filter('stripStyles', function() {
  return function(str) {
    return str.replace(/style=['"].*["']/, '');
  }
});

（您需要将过滤器定义的app.部分更改为适用于您的应用的任何部分。使用您用于.controller（）调用的任何前缀/方法。）

如果您要删除多个样式或类，则应该使用正则表达式的非贪婪版本：

str.replace(/class=['"](.*?)["']/g, '')

然后你会将你的data-ng-bind-html="article.Content"更改为：

<div class="cell" data-ng-bind-html="article.Content | stripClasses | trustAsHtml"></div>

或者，对于类和样式删除：

<div class="cell" data-ng-bind-html="article.Content | stripStyles | stripClasses | trustAsHtml"></div>

This Plunk我为another answer做了如何使用trustAsHtml过滤器，并展示了如何在控制器中使用$ sce服务。