Как использовать один и тот же sidenav на нескольких страницах

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

Wrap код NavBar в шаблоне затем использовать этот шаблон на каждой странице. См. example in the Meteor Todo app tutorial. Или, если вы используете Iron Router, поместите его в свой шаблон тела приложения. Пример

Шаблон:

<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}}