Question

我的页面的{{yield}}部分无法使用我的引导程序布局进行渲染。它表现得好像只是附加在身体上而不是插入到正确的位置。

以下是我的模板的相关部分：

<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-12">
                <nav class="navbar navbar-default" role="navigation">
                    ...
                </nav>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-9">
                {{yield}}
            </div>

            <div class="col-xs-3">
                <ul class="nav nav-pills nav-stacked">
                    {{> sideNav}}
                </ul>
            </div>
        </div>
    </div>
</body>

<template name="home">
    <p>Home Ya'll.</p>
</template>

一切正常，并且home模板正在呈现，但它的渲染基本上是这样的：

<body>
    <div class="container-fluid">...</div>
    <p>Home ya'll.</p> <!-- This should be inside the div -->
</body>

home模板部分之后的div而不是。发生了什么事？

如果重要，我会在this less enabled package包含引导程序。

Answer 1

如https://github.com/EventedMind/iron-router#concepts

正式文件开头所述

Iron-router接管生成页面的<body>。您不需要像对HTML页面那样定义<body>元素;相反，您定义了"layout"（通常为<template name="layout">...</template>，其中包含不会在应用页面之间发生变化的静态元素，还包含一个或多个{{yield}}标记（技术上模板帮助程序）这将从其他模板中引入内容。在布局文件中，不带任何参数的{{yield}}标记称为"main yield"，它将引入{route()的模板选项指定的路由模板。 {1}}方法调用。

根据这一点，不要将主体作为主模板，而是将其包装在布局模板中

<template name="layout">
  {{yield}}
</template>

并在路线配置中将模板名称声明为主要布局。

Router.configure({
  layoutTemplate: 'layout'
});

Meteor {{yield}}无法使用Bootstrap在正确的位置渲染

1 个答案: