AngularJS忽略内联样式

Question

请考虑以下事项：

<span ng-bind-html="product.icon"></span>

如果product.icon包含：

<img src="http://localhost/angularjs/public/gfx/product/logo_1.png" width="18" height="18">

它会显示正常。但是，如果它包含：

<img src="http://localhost/angularjs/public/gfx/product/logo_1.png" style="width: 18px; height: 18px">

然后width和height不受尊重。

为什么会这样？是因为来自内联样式的:还是;？

Answer 1

在这种情况下，仅使用ng-bind-html是不够的，我必须将其与此过滤器结合使用：

angular.module('myApp')
    .filter('to_trusted', ['$sce', function($sce){
        return function(text) {
            return $sce.trustAsHtml(text);
        };
    }]);

现在使用<span ng-bind-html="product.logo_and_name | to_trusted"></span>内联css得到尊重。