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風格不起作用

回答

相關問題