我目前正在浏览Meteor教程(https://www.meteor.com/try),并且遇到了一些困扰我的模板.
在本教程中,将创建一个简单的"Todo List"应用程序.在此应用程序中,以下HTML放在simple-todos.html文件中:
<!-- simple-todos.html -->
<head>
<title>Todo List</title>
</head>
<body>
<div class="container">
<header>
<h1>Todo List</h1>
</header>
<ul>
{{#each tasks}}
{{> task}}
{{/each}}
</ul>
</div>
</body>
<template name="task">
<li>{{text}}</li>
</template>
Run Code Online (Sandbox Code Playgroud)
然后,将以下JavaScript放入simple-todos.js文件中:
// simple-todos.js
Tasks = new Mongo.Collection("tasks");
if (Meteor.isClient) {
// This code only runs on the client
Template.body.helpers({
tasks: function () {
return Tasks.find({});
}
});
}
Run Code Online (Sandbox Code Playgroud)
此时,该示例完全按预期工作.但是,当我在文档中查看,以及查看Web上的其他示例时,我注意到语法略有不同:使用Template.myTemplate而不是Template.身体.
因此,出于好奇,我将我的JavaScript文件更改为:
Template.task.helpers({ ...
Run Code Online (Sandbox Code Playgroud)
代替:
Template.body.helpers({ ...
Run Code Online (Sandbox Code Playgroud)
但是,当我现在运行应用程序时,客户端不会显示集合中的数据.我没有得到关于未定义类型的任何错误,就像我在JavaScript中拼错模板名称一样,所以它似乎正在正确地解析模板.但为什么它不被使用或渲染?
更进一步:什么时候使用模板是合适的.myTemplate以及何时使用Template是合适的.身体?
帮助程序代码仅适用于它附加的模板.
因此,Template.task适用于的代码仅适用于名为"task"的模板.
模板.身体就像存在的一次性,因为如果它不存在则会很奇怪.这是一种专门针对你的方法<body>,尽管从技术上讲,没有名为"body"的模板.
那么发生了什么:
你的逻辑说:
在父模板中,对于我们找到的每个任务,渲染子模板"task"的实例.
如果您将助手从更改body为task,则根本不会获得任何输出,除非您模仿已经发生的模式:
<template name="task">
{{#each tasks}}
do something
{{/each}}
</template>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1786 次 |
| 最近记录: |