Angular ternary operator with html output

Question

Is it possible to render the output from a ternary operator as html?

{{ boolA ? 'Some text' : '&lt;i class=\"fa fa-check\"&gt;&lt;/i&gt;' }}

Also tried to modify a inline if/else directive from a previous question but can't get this to work either.

.filter('iif', ['$sce', function ($sce) {
    return function (input, trueValue, falseValue) {
        return $sce.trustAs('html', input ? trueValue : falseValue);
    }
}])

Yes. it is possible to render. Have you written ng-bind-html in your html? — Varit J Patel
– Varit J Patel, Commented Jul 19, 2016 at 9:07

Mihir · Accepted Answer · 2016-07-19 09:44:44Z

5

Yes, Use ng-bind-html like this :

<span ng-bind-html=" your_condition ? 'html_if_true' : 'html_if_false' "></span>

Replace values according to your requirements.

edited Jul 19, 2016 at 9:44

answered Jul 19, 2016 at 9:39

Mihir

3484 silver badges18 bronze badges

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

1 Comment

stig Over a year ago

Perfect, thanks. Then I can use angle brackets as well and just escape the quotes.

Collectives™ on Stack Overflow

Angular ternary operator with html output

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related