CODEWITHSUNDEEP
angularjsangularjs-directive
Daniel Pecher
Daniel Pecher

Reputation: 202

HTML in directive attributes

Is it a good idea to pass HTML string as a directive attribute in AngularJS? Like so:

<tile data-content="<b>Some text</b>"></tile>

This is just an example, the string would actually be much longer and more complex. I am creating tile directive that shows a modal window with additional content upon clicking. I know it's a string like any other, but it seems to me that there's a better way.

Upvotes: 0

Views: 92

Answers (2)

Joe Naber
Joe Naber

Reputation: 537

if your template currently reads: 

<span>{{dataContent}}</span>

change it to:

<span ng-bind-html-unsafe="dataContent"></span>

Here is a fiddle FIDDLE to demonstrate

Upvotes: 0

Liviu T.
Liviu T.

Reputation: 23664

I suggest you take a look at transclusion. With it you could do this:

<tile>
  <b>Some text</b>
</tile>

I would say this is most appropriate

Otherwise if the content is dynamic I would put it in a model and pass that to the directive. If not then I would pass an identifier for a partial html file that will be downloaded and inserted using $http service.

Upvotes: 1

Related Questions