Getting side-menu and tabs working together

All my views are loaded into the mainContainer.html view which looks like:

<script id="mainContainer.html" type="text/ng-template">


      <ion-pane ion-side-menu-content>
        <ion-nav-bar type="bar-positive" back-button-type="button-icon" back-button-icon="ion-ios7-arrow-back" animation="nav-title-slide-ios7">

        <ion-nav-view name="main"></ion-nav-view>

      <ion-side-menu side="left">
        <header class="bar bar-header bar-assertive">
          <div class="title">Side Menu</div>
        <ion-content has-header="true">
          <ul class="list">
            <a class="item" ng-click="toggleMenu()">Item1</a>
            <a class="item" ng-click="toggleMenu()">Item2</a>



I would hence expect that any view loaded into main would have a blue nav bar along with side-menu icon on the left.

Kindly check this plnkr and advice what I am doing wrong here: