Question

我正在尝试学习js模板并撰写以下页面：

<!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>

预期行为：我希望看到hello EARTH!

但我看到init text

我错了什么？

Answer 1

这里有很多错误。在发布问题之前，你应该学会查看你的JavaScript控制台并进行一些调试，因为有很多错误，很难说出是什么导致了你的特定错误。

没有＆＃34; JavaScript模板＆＃34;。这是一个 Underscore 模板（或者，在这种情况下是lodash），这是一个库，而不是内置于JavaScript中的东西。
您正在使用<% %>错误。如果你想插入＆＃34; EARTH＆＃34;的值。对于＆＃34;世界＆＃34;变量，你需要的东西
```
hello <%= world %>!
```
实际上，使用<% hello world %>，您可以告诉模板使用名为hello的变量调用名为world的函数。即使下面的＃3已修复，您仍然会收到错误。
最后，最重要的是，你有一个非常明显的语法错误。您在{}周围遗漏了world: 'EARTH'。您的脚本块甚至无法解析，并且JavaScript控制台上应该有一个非常明显的错误，告诉您出现此语法错误的确切行。

如何将变量传递到javascript模板？

1 个答案: