0

I have angularJS service that returns a string, this string may contain HTML tags, something like this 

"<strong>Error:</strong>Something is wrong"

and I have an element div where I want to put this message

<div class="alert alert-danger" ng-bind="vm.message" role="alert"></div>

When this message is set to the text above, in HTML page the result shows up AS IS, meaning 

<strong>Error:</strong>Something is wrong.

Instead of

Error:Something is wrong.

How can I output this text like this, so that HTML tags will be rendered?

monstro
  • 6,254
  • 10
  • 65
  • 111
  • 2
    `this.message = $sce.trustAsHtml("Error:Something is wrong")`. However, your service should probably not return you HTML string like this. Make service return `{type: 'error', message: 'Something is wrong'}` and make proper formatting in template. – dfsq Jul 21 '16 at 13:22

1 Answers1

0

Check this https://docs.angularjs.org/api/ng/directive/ngBindHtml

use ng-bind-html directive to bind string as html

optimus
  • 729
  • 2
  • 12
  • 36
  • can i know why -1 for this answer ? – optimus Jul 21 '16 at 13:26
  • 1
    I actually consider it as an answer. The only thing he forgot to mention is that for ng-bind-html to work, I have to include angular-sanitize.min.js file and add ngSanitize to my app module: var app = angular.module('app', ['ngSanitize']); – monstro Jul 21 '16 at 20:03
  • @ShudhanshShekhar: Referral links are encouraged in stackoverflow please read http://stackoverflow.com/help/how-to-answer. – optimus Jul 22 '16 at 03:37