无法获取 Angular 过滤器以显示 Html 实体

Question

我正在尝试为 "True" 值显示一个绿色勾号，为 "False values in my MVC View using angular. Using a filter, I can display the unicode check (u+2713) and cross (u+2718), but they want a " 绿色勾号显示一个红叉号，还有一个 "red" 叉号。我包括了 angular -sanitize.js 在我的页面上并尝试使用 ng-bind-html-unsafe 指令，当我这样做时该字段是空白的。

谁能告诉我我在这里缺少什么？

这是我的 HTML 页面：

<script src="~/Scripts/app/AccordionCtrl.js"></script>
<script src="~/Scripts/app/checklist-model.js"></script>
<script src="~/Scripts/angular-sanitize.js"></script>
<div ng-app="myModule" ng-controller="AccordionCtrl">

        <table class="table">
            <thead style="background-color:#0e438d; color:white">
                <tr>
                    <td>Company Name</td>
                    <td>City</td>
                    <td>State</td>
                    <td>System ID</td>
                    <td>Releast Status</td>
                    <td>Training Tracker</td>
                    <td>SSQ Complete</td>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="contractor in contractors">
                    <td>{{contractor.vchCompanyName}}</td>
                    <td>{{contractor.vchOprCity}}</td>
                    <td>{{contractor.vchOprStateID}}</td>
                    <td>{{contractor.CompanyID}}</td>
                    <td>{{contractor.ReleaseStatus}}</td>
                    @*<td>{{contractor.TrainingTracker|applyMarks}}</td>*@
                    <td><span ng-bind-html-unsafe="contractor.TrainingTracker | applyMarks"></span></td>
                    <td>{{contractor.SSQComplete|applyMarks}}</td>
                </tr>
                <tr>
                    <td>&#10004</td>
                </tr>
            </tbody>

        </table>
    </div>
</div>

这是我控制器中的过滤器代码：

app.filter("applyMarks", function(){
    return function(input){
        if(input == true){
            //return '\u2713';
            return '&#10004';
        }
        else
        {
            return '\u2718'
        }
    };

Answer 1

ng-bind-html-unsafe 自 angular 1.2 版本以来已被弃用。

您需要使用 $sce 来清理您的 html。

标记

ng-bind-html="contractor.TrainingTracker | applyMarks | trustedhtml"

代码

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

无法获取 Angular 过滤器以显示 Html 实体

Cannot get Angular Filter to display Html Entity

html

javascript

angularjs

angularjs-filter