How to pass variable into javascript template?

Question

I trying to learn js templates and wrote following page:

<!DOCTYPE html>
 <html>
 <head>
   <meta charset="utf-8">
   <script src="http://code.jquery.com/jquery-latest.js"></script>
   <script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/0.9.0/lodash.js"></script>

 </head>
 <body>

 <div id="helloDiv">init text</div>


<script type="text/template" id="test">
<% hello world %>!
</script>
<script>


$('#helloDiv').html( 
  _.template( $('#test').html().trim(),world : 'EARTH') 
);

</script>


</body>
</html>

Expected behaviour: I want to see hello EARTH!

But I see init text

What do I wrong?

user229044 · Accepted Answer · 2014-10-22 22:09:22Z

3

There is a lot wrong here. You should learn to look at your JavaScript console and do some debugging before posting questions, because there is so much wrong that it's difficult to tell what thing is causing your specific error.

There is no such thing as a "JavaScript template". That's an Underscore template (or, lodash in this case), which is a library and not at all something built into JavaScript.
You're using <% %> wrong. If you want to interpolate the value of "EARTH" for the "world" variable, you need something along the lines of
```
hello <%= world %>!
```
As it is, with <% hello world %>, you're telling the template to invoke a function called hello with a variable called world. Even if #3 below were fixed, you'd still be getting an error.
Finally, and most importantly, you have a very obvious syntax error. You're missing {} around your world: 'EARTH'. Your script block won't even parse, and there should be a very obvious error on the JavaScript console telling you the exact line on which this syntax error occurs.

edited Oct 22, 2014 at 22:09

answered Oct 22, 2014 at 22:03

user229044♦

241k41 gold badges347 silver badges350 bronze badges

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

1 Comment

gstackoverflow Over a year ago

I tired a lot of modifications of template before posting question. console sometimes compains about something and sometimes - not, but it doesn't work anyway. Thanks for you right answer. I didn't know anything about underscore and that it is underscore. I am bad in frontend.

Collectives™ on Stack Overflow

How to pass variable into javascript template?

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