[英]AngularJS: ng-bind-html remove styling
在我的应用程序中,我正在使用table
和ng-repeat
。 我正在渲染我的数据,其中一列是在以下帮助下渲染的:
<div class="cell" data-ng-bind-html="article.Content">
</div>
但我有一个问题,如果我有以下内容:
<div class="page-wrap">123</div>
它打破了我的整个风格( 因为页面也有页面包装 )。
渲染html是否真实,但没有渲染样式和CSS风格? 如何?
喜欢:
<div>123</div>
我相信你所说的是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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.