CODEWITHSUNDEEP
jqueryhtmlparametersjquery-templates
Arsen Babajanyan
Arsen Babajanyan

Reputation: 123

JQuery Templates: pass html parameter into a function

I have this JQuery template:

$.tmpl('<p>${text}</p>', { text: 'cool text' }).appendTo('div');

Works great. but now I want to pass a html parameter into it, but the following won't work.

$.tmpl('<p>${text}</p>', { text: '<span>cool text</span>' }).appendTo('div');

Any suggestions?

Upvotes: 0

Views: 1973

Answers (2)

khushboo29
khushboo29

Reputation: 916

There is one more way you can do it

var markup = "<span>${text}</span>";

jQuery.template( "template1", markup );
jQuery.tmpl( "template1", { text: "cool text" } ).appendTo( "div" );

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388316

You can use the {{html content}} construct

$.tmpl('<p>{{html text}}</p>', {
  text: '<span>cool text <b>bold</b></span>'
}).appendTo('div');
span {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
<div></div>

Upvotes: 2

Related Questions