AngularJS directive that contains ng-bind-html directive

Question

I want this piece of code

<test data="myObject"></test>

to be rendered as

<p>raw html code that is stored inside myObject.html</p>

My directive

module.directive('test', function() {
    return {
        restrict: 'E',
        template: '<p ng-bind-html="__what_to_do_here__?"></p>',
        scope: {
            // This object has a html propery which contains raw html.
            data: '='
        }
    };
});

How can i pass the raw html variable to the ngBindHtml directive in my template?

ng-bind-html="data.html" - does that work?

tymeJV
– tymeJV

2015-02-13 21:31:50 +00:00
Commented Feb 13, 2015 at 21:31 — tymeJV
– tymeJV, Commented Feb 13, 2015 at 21:31
nope - that's why i'm asking

brazorf
– brazorf

2015-02-13 21:36:17 +00:00
Commented Feb 13, 2015 at 21:36 — brazorf
– brazorf, Commented Feb 13, 2015 at 21:36

Hugues Stefanski · Accepted Answer · 2015-02-13 22:16:33Z

1

Did you include ngSanitize? I think it is required to be able to render html from a variable. You can find more information about ng-bind-html here: https://docs.angularjs.org/api/ng/directive/ngBindHtml (will also link you to ngSanitize)

answered Feb 13, 2015 at 22:16

Hugues Stefanski

1,1821 gold badge8 silver badges11 bronze badges

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

1 Comment

Hugues Stefanski Over a year ago

Thanks for the replies, this is my first answer. And as I don't have enough reputation, I couldn't ask the question as a comment... Will try to make it better next time

Collectives™ on Stack Overflow

AngularJS directive that contains ng-bind-html directive

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