3

我正在使用模板在 Meteor 中生成 HTML 标记属性，但似乎已损坏。我不能将模板放在流星的 HTML 标记中，我想知道为什么。

我正在使用流星路由器进行路由。由于流星基本上只允许单一布局，我想在 body 中添加一个类，指示当前视图名称，如下所示：

/client/layout.html：

<head>
  <title>Meteor App</title>
</head>

<body {{> body-attributes}}>
  {{renderPage}}
</body>

<template name="body-attributes">data-view-name="{{page}}" class="{{page}}"<template>

这样我就可以在 /client/layout.js 中执行此操作：

Template['body-attributes'].page = function () {
  return Meteor.Router.page();
};

但这不起作用，我从应用程序中收到一个错误，说不支持身体上的属性。将 layout.html 更改为此：

<head>
  <title>Meteor App</title>
</head>

<body>
  <div {{> body-attributes}}>
      {{renderPage}}
  </div>
</body>

<template name="body-attributes">data-view-name="{{page}}" class="layout-container {{page}}"<template>

导致 HTML 完全损坏。浏览器在页面前显示一个“>”，控制台元素面板如下所示： 控制台截图

为什么那行不通？

4

2 回答 2

3

{{> body-attributes}}在 HTML 标记（在您的情况下为标记）内部调用body最终意味着 Meteor 将在该位置将DocumentFragment注入到 DOM 中。

为了反应性，这些DocumentFragments不是模板中标记的普通复制品，而是包裹在特殊的 Meteoresque 反应性标签中，帮助后端引擎保持Template更新。您可以通过调用 Template 函数并调查以下内容来看到这一点_domFrag：

var _domFrag = Template.myTemplateName();

因此，Templates在流星上下文中，并非旨在作为 HTML 标签上的属性嵌入，因为它在标签本身中注入了额外的标签。您的第二次尝试更符合框架的工作方式。

希望这有助于解释这种行为。

于 2012-12-28T17:03:42.517 回答
2

我不知道为什么流星不允许最高级别的 HTML 标记内的模板，但我找到了解决这个问题的方法。我将 layout.html 更改为如下所示：

<head>
  <title>Meteor App</title>
</head>
<body>
  {{> global-layout}}
</body>

<template name="global-layout">
  <div data-view-name="{{page}}" class="global-container {{page}}">
    {{renderPage}}
  </div>
</template>

然后在layout.js中将名称从切换body-attributes到。global-layout这完美地解决了我的问题，但我仍然很想知道为什么第一个选项（在我的问题中）最初不起作用。

于 2012-12-28T16:51:29.813 回答