Nav bar color not shown on IOS device

My nav-bar color selection shows in browser and IOS emulator. It does not show on the real device.

<ion-view view-title="The" cache-view="false">
  <ion-nav-bar class="bar-energized">
  </ion-nav-bar>

  <ion-nav-buttons side="left">
    <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
    </button>
  </ion-nav-buttons>

  <ion-nav-buttons side="right">
    <button class="button" ng-click="prevPage()" ng-disabled="pageNo<=0">Back</button>
    <button class="button" ng-click="nextPage()" ng-disabled="pageNo>=maxPages">Next</button>
  </ion-nav-buttons>
  
  <ion-content>
    <div ng-include="pageName">
    </div>
  </ion-content>
</ion-view>

solved with the following:

<ion-view view-title="The Four Noble Truths" cache-view="false">
<ion-header-bar class="bar-energized">
  <ion-nav-bar class="bar-energized">
  <ion-nav-buttons side="left">
    <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
    </button>
  </ion-nav-buttons>

  <ion-nav-buttons side="right">
    <button class="button" ng-click="prevPage()" ng-disabled="pageNo<=0">Back</button>
    <button class="button" ng-click="nextPage()" ng-disabled="pageNo>=maxPages">Next</button>
  </ion-nav-buttons>
  </ion-nav-bar>
  </ion-header-bar>
  
  <ion-content>
    <div ng-include="pageName">
    </div>
  </ion-content>
</ion-view>