How to display HTML from response as HTML in ng-repeat

Question

I have n number of records coming from backend as HTML in array. I need to display the HTML response as HTML in my view. I tried ng-bind-html , but it takes the last value. Need assistance.

  $scope.res=  "data": [
            {
              "jd": "<p>this jd1</p>"
            },
            {
              "jd": "<li>this jd2</li>"
            },
            {
              "jd": "<ul>this jd3</ul>"
            },
            {
              "jd": "<p>this jd4</p>"
            }
          ]
        }

Html:

 <div ng-repeat="item in res">
    <div ng-bind-html ="item.jd">
    </div>

mrb · Accepted Answer · 2018-06-11 07:29:48Z

3

You can use $sce.trustAsHtml. See the documentation here.

What you could do is:

Add this line in your controller:

$scope.trustAsHtml = $sce.trustAsHtml;

And update your HTML like this:

<div ng-bind-html ="trustAsHtml(item.jd)">

Note that you should probably start using Angular 6 instead of AngularJS

answered Jun 11, 2018 at 7:29

mrb

681 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nicoleta Wilskon Over a year ago

Hi , sure will do it. I have one more query. I am doing encoding and sending the html response to backend. Now I need to decode them and use it here. So I wrote a filter. DecodeFilter: app.filter('decodeFilter', function() { return function(input) { return decodeURIComponent(unescape(input)); }; });

Collectives™ on Stack Overflow

How to display HTML from response as HTML in ng-repeat

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related