从 AngularJS 对象渲染 html 标记

Render html tags from AngularJS object

本文关键字:html 标记 AngularJS 对象      更新时间:2023-09-26

我已经查找了有关如何在angularJS中呈现html标签的类似问题,但没有一个对我有用,因为我正在使用ng-repeat。任何人都有任何建议。

     <div ng-repeat="o in SurveyResults.SurveyQuestions">
                    {{o.SurveyQuestionId}}
                    {{o.QuestionText}}
     </div>

我的o.QuestionText包含<b>How well do we deliver on our promises?</b> <br />Consider our responsiveness to your requests, ability to meet deadlines and <i>accountability for the outcomes</i>.等数据

它显示标记而不呈现标记。

我确实尝试将其放入我的JS文件中

    homePage.directive('htmlSafe', function($parse, $sce) {
    return {
        link: function(scope, elem, attr) {
            var html = attr.ngBindHtml;
            if(angular.isDefined(html)) {
                var getter = $parse(html);
                var setter = getter.assign;
                setter(scope, $sce.trustAsHtml(getter(scope)));
            }
        }
    };
});

然后在重复中设置 html 绑定,这样

 <div ng-repeat-html="o in SurveyResults.SurveyQuestions">
                    {{o.SurveyQuestionId}}
                    {{o.QuestionText}}
     </div>

还有其他建议吗?

只需使用 ng-bind-html,您不需要新指令

 <div ng-repeat="o in SurveyResults.SurveyQuestions">
                {{o.SurveyQuestionId}}
                <span ng-bind-html="o.QuestionText"></span>
 </div>