Question

所以我在我的一个页面上创建了一个sidenav，并在那里正常工作我想要做的是在另一个页面上，我想使用相同的sidenav。

我的导航代码：

<form id="keyword-form" class="side-nav rt-side-nav">
    <div>
        <center><h5>KEYWORDS</h5></center>
        <textarea rows="10" cols="50" id="txtarea" class="keyword-text" placeholder="enter comma seperated values for the products" contenteditable="true">{{keywords}}</textarea>                      
    </div>                      
    <div class="keyword-submit">
        <center><button type="submit" class="key-submit btn waves-effect waves-light col m12">SUBMIT</button></center>
    </div>
</form>
<a data-activates="keyword-form" class="button-collapse"></a>
<div hidden class="keyword">
</div>

Answer 1

将导航栏代码包装在模板中，然后在每个页面上使用该模板。见example in the Meteor Todo app tutorial。或者，如果您使用铁路由器，请将其放入您的应用主体模板。

模板示例：

<template name="sidenav">
    <form id="keyword-form" class="side-nav rt-side-nav">
        <div>
            <center><h5>KEYWORDS</h5></center>
            <textarea rows="10" cols="50" id="txtarea" class="keyword-text" placeholder="enter comma seperated values for the products" contenteditable="true">{{keywords}}</textarea>                      
        </div>                      
        <div class="keyword-submit">
            <center><button type="submit" class="key-submit btn waves-effect waves-light col m12">SUBMIT</button></center>
        </div>
    </form>
    <a data-activates="keyword-form" class="button-collapse"></a>
    <div hidden class="keyword">
    </div>
</template>

然后每次你想展示你的sidenav：

{{> sidenav}}

我如何在多个页面中使用相同的sidenav

1 个答案: