NG绑定，HTML风格不起作用

我在寻找如何与NG绑定，HTML解决我的问题 作为输入我recive例如图标与HTML

icon: '<i class="fa fa-sign-out"><i>'

这正常工作与NG绑定-HTML：

let buttonIcon = angular.element(`<span ng-bind-html="icon"></span>`);

和显示是这样的：

但比我试图红色添加到FA-图标

icon: '<i class="fa fa-sign-out" style="color:red;"><i>'

，但没有成功

所以我看了一下HTML，似乎style="color:red;"不在那里。

，但我不会显示这样的：

（我试过在开发中添加样式工具看，如果它的工作原理）

问候

来源

2017-04-05 Andrej

我解决了'图标： '''和加入this'.test-成功{ 颜色：红;在css中 – Andrej

使用$sce.trustAsHtml ..

https://docs.angularjs.org/api/ng/service/ $ sce

(function(angular) { 
 
    'use strict'; 
 
angular.module('myApp', ['ngSanitize']) 
 
    .controller('ctrl', ['$scope','$sce', function($scope,$sce) { 
 

 
$scope.uCanTrust = function(string){ 
 
return $sce.trustAsHtml(string); 
 
} 
 
$scope.Stack = '<i class="fa fa-stack-overflow" style="color:#0077dd;font-size:34px" aria-hidden="true"></i>'; 
 
$scope.icon= $sce.trustAsHtml('<i class="fa fa-stack-overflow" style="color:red;font-size:34px" aria-hidden="true"></i>'); 
 
    $scope.trustme= $sce.trustAsHtml('<a href="#" style="color:red">Click Me!</a>'); 
 

 
    
 
    }]); 
 
})(window.angular);

<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title></title> 
 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> 
 
    <script src="//code.angularjs.org/snapshot/angular.min.js"></script> 
 
    <script src="//code.angularjs.org/snapshot/angular-sanitize.js"></script></head> 
 
<body ng-app="myApp"> 
 
    <div ng-controller="ctrl"> 
 
<p ng-bind-html="trustme"></p> 
 
<p ng-bind-html="icon"></p> 
 
    
 
<p ng-bind-html="uCanTrust(Stack)"></p> 
 
</div> 
 
</body> 
 
</html>

来源

2017-04-05 11:31:24

NG绑定，HTML风格不起作用

回答

相关问题