How to display HTML content value in angularJS

Question

I want to display my editor value from MySQL database. when I am displaying data with angularJS then it is showing text with html tag.

HTML Code:-

<pre>
  {{x.description}}
</pre>

Here I am getting output:-

<p>Hello India</p><br/>
<p>List Of State</p><br/>
<ol><br/>
<li>Karnataka</li><br/>
<li>Bihar</li><br/>
<li>Delhi</li><br/>
</ol>

But I want to result Like this:-

Hello India 
List of State
  1. Karnataka
  2. Bihar
  3. Delhi

@vivek_23 not working

Chit
– Chit

2019-07-01 08:21:26 +00:00
Commented Jul 1, 2019 at 8:21 — Chit
– Chit, Commented Jul 1, 2019 at 8:21
My bad. I thought you were using angular CLI.

mighty_dev
– mighty_dev

2019-07-01 08:44:53 +00:00
Commented Jul 1, 2019 at 8:44 — mighty_dev
– mighty_dev, Commented Jul 1, 2019 at 8:44
@vivek_23 I am using angularJS 1.x

Chit
– Chit

2019-07-01 09:01:19 +00:00
Commented Jul 1, 2019 at 9:01 — Chit
– Chit, Commented Jul 1, 2019 at 9:01

Ravikumar Rajendran · Accepted Answer · 2019-07-01 08:19:20Z

3

This can be done by using ng-bind-html

var app = angular.module("myApp", ['ngSanitize']);
app.controller("myCtrl", function($scope) {
    $scope.myText = `<p>Hello India</p><br/>
<p>List Of State</p><br/>
<ol><br/>
<li>Karnataka</li><br/>
<li>Bihar</li><br/>
<li>Delhi</li><br/>
</ol>`;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-sanitize.js"></script>


<div ng-app="myApp" ng-controller="myCtrl">
<pre>
 <div ng-bind-html="myText"></div>
</pre>
</div>

answered Jul 1, 2019 at 8:19

Ravikumar Rajendran

5142 silver badges9 bronze badges

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

Collectives™ on Stack Overflow

How to display HTML content value in angularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related