[Go Revel] テンプレートでナビテーションを一元管理する – ソフトウェアエンジニアの技術ブログ：Software engineer tech blog

Go Revelでnavigationとside menuをテンプレート化したい
-> classでページによってis-activeと付与する箇所は、テンプレート側でセットできるようにする。

/app/views/menu.html

  <section class="main-content columns is-fullheight">
  <aside class="column is-3 is-narrow-mobile is-fullheight section is-hidden-mobile">
    <p class="menu-label is-hidden-touch">MENU</p>
    <ul class="menu-list">
      <li>
        <a href="/home" class="{{.home}}">
          <span class="icon"><i class="fa fa-home"></i></span> Home
        </a>
      </li>
      <li>
        <a href="#" class="">
          <span class="icon"><i class="fa fa-table"></i></span> Channel
        </a>

        <ul>
          <li>
            <a href="#" class="{{.ch1}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch1
            </a>
          </li>
          <li>
            <a href="#" class="{{.ch2}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch2
            </a>
          </li>
          <li>
            <a href="#" class="{{.ch3}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch3
            </a>
          </li>
        </ul>
      </li>
      <li>
        <a href="#" class="{{.mypage}}">
          <span class="icon"><i class="fa fa-id-card"></i></span> MyPage
        </a>
      </li>
      <li>
        <a href="#" class="{{.doc}}">
          <span class="icon"><i class="fa fa-file-alt"></i></span> Document
        </a>
      </li>
      <li>
        <a href="#" class="{{.chat}}">
          <span class="icon"><i class="fa fa-comments"></i></span> Chat room
        </a>
      </li>
    </ul>
  </aside>

/app/views/App/Index.html

{{template "nav.html" .}}
{{set . "home" "is-active"}}
{{template "menu.html" .}}

/app/views/App/mypage.html

{{template "nav.html" .}}
{{set . "mapage" "is-active"}}
{{template "menu.html" .}}