AngularJS ng-bind-html not working with expression

Question

I'm trying to evaluate an expression in ng-bind-html but it's not working. If anyone knows workaround for this, please help.

The code below is showing nothing.

<h5 ng-bind-html="{{feedType ==='popularProducts' ? displayedProduct.title : displayedProduct.name}}"></h5>

Are you getting any error in console and are you sure ng-bind-html will evaluate expression in {{}} ? I have tried in fiddle jsfiddle.net/L4zqv6fg/1 and {{}} itself is not getting evaluated.. Can you please update the fiddle with more info about controller details or why you are using ng-bind-html here? — Rajat
– Rajat, Commented Jan 1, 2020 at 8:38
{{}} is not working with ng-bind-html tag. That's why I'm asking for workaround. I'm using ng-bind-html because the content contains some symbol codes which is converted by html like registered/TM symbol code. — Nikhil Attar
– Nikhil Attar, Commented Jan 1, 2020 at 9:03
Got it. Can you please check stackoverflow.com/questions/40788937/… if this can help? — Rajat
– Rajat, Commented Jan 1, 2020 at 9:13
No I'm not supposed to add any kind of controller. All I can do is change in the tag with some angularjs directive. — Nikhil Attar
– Nikhil Attar, Commented Jan 1, 2020 at 9:24

Nitheesh · Accepted Answer · 2020-01-01 11:09:33Z

3

The ngBindHtml directive expects the attribute value as an expression so there is no need for the {{}} interpolation. Simply remove those braces so that you’re passing your expression directly to the directive.

Working Syntax:

<h5 ng-bind-html="feedType === 'popularProducts' ? displayedProduct.title : displayedProduct.name"></h5>

Applicable AngularJS docs

edited Jan 1, 2020 at 11:09

Nitheesh

20.1k3 gold badges28 silver badges52 bronze badges

answered Jan 1, 2020 at 10:39

g_param

1565 bronze badges

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

Collectives™ on Stack Overflow

AngularJS ng-bind-html not working with expression

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related