Javascript 木偶3模板可以内联工作,但不包括在单独的文件中
我已经能够让我的木偶3模板工作时,他们是内联的。当我在.html文件中包含模板时,在呈现视图时会出现NoTemplateError。我见过使用TemplateCache和require的示例,但我不明白为什么不能在正文中包含template.html文件并使其工作 主源文件Javascript 木偶3模板可以内联工作,但不包括在单独的文件中,javascript,templates,inline,marionette,Javascript,Templates,Inline,Marionette,我已经能够让我的木偶3模板工作时,他们是内联的。当我在.html文件中包含模板时,在呈现视图时会出现NoTemplateError。我见过使用TemplateCache和require的示例,但我不明白为什么不能在正文中包含template.html文件并使其工作 主源文件 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/html"> <head> <title>Gmail API
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
<title>Gmail API Quickstart</title>
<meta charset='utf-8' />
</head>
<body>
<script src="jquery.js" type="text/javascript"></script>
<script src="underscore_1_8_3.js" type="text/javascript"></script>
<script src="backbone.js" type="text/javascript"></script>
<script src="backbone.radio.js" type="text/javascript"></script>
<script src="backbone.marionette_3_2_0.js" type="text/javascript"></script>
<script src="bootstrap.js" type="text/javascript"></script>
<link href="bootstrap.css" rel="stylesheet">
<link href="mycss.css" rel="stylesheet">
<script src="messageDetails.js" type="text/javascript"></script>
Gmail API快速入门
//此模板有效
<script type="x-template/underscore" id="mailItem-template">
<div id="mailItem" class="col-md-12">
<img src="trash_recyclebin_empty_closed.png" align = "top" width="18" height="18"/>
<input type="checkbox" style="padding: 10;"/>
</div>
</script>
//如果我注释掉上面的模板并将其放入.html文件中,则该模板在视图中不起作用。我试过了
<link href="mailItem.tmpl.html" type="text/html"/>
//我也尝试过这个,但是我得到了一个语法错误
<script src="mailItem.tmpl.html" type="text/javascript"/>
//使用模板的视图
<script src="MessageDetailsView.js" type="text/javascript"></script>
这是因为使用
标记不会加载它。基本上,如果
标记不是javascript,浏览器将不使用它。。这很方便,因为您可以稍后获取它以将其用作模板,但浏览器永远不会加载外部模板
您可以做的是将外部模板设置为javascript
var myTemplate = _.('My template text');
然后,您应该能够通过一个标签加载它,期望myTemplate
在全球范围内可用
但最好的选择是使用webpack之类的构建工具预编译模板,并将其作为javascript直接导入脚本
更多信息: