How to have a static header with dynamic content?

So, I have this static header in my XML:

<ion-header-bar class="bar-positive has-tabs-top" ng-controller="HeaderCtrl as header">
  <h3 class="title">{{ header.headerTitle }}</h3>
</ion-header-bar>  

And I have those two controllers:

var HeaderCtrl;

angular.module('ido.controllers', [])

.controller("HeaderCtrl", function HeaderFunctions(){

    HeaderCtrl = this;

    HeaderCtrl.headerTitle = "aa";
})

.controller("MainCtrl", function MainFunctions() {

    HeaderCtrl.headerTitle = "bb";
})

And this works! However, I am under the impression that I'm doing this the bad way. I mean, I could get a null value from the HeaderCtrl, right? Well, the thing is, there is no way to go to the "Main" screen before getting through the Index, which is where the Header is located.

I just need to know if I'm doing something terrible here or it's fine as it is.