controllerAs method is not getting called when others are - angularjs

Question

I' trying out firebase 3 with my Ionic app. (I just made one to mess with - so I figure i might as well do everything right from the beginning, such as using ControllerAs notation)
everything in the controller works fine. just the logUserOut method doesnt fire - at all! I'm at a loss.
controller:
.controller('DashCtrl', function($scope, $ionicModal, DataService, AuthService) {
var ctrl = this;
ctrl.icons = [];
//// SERVICE GETS
ctrl.allIcons = DataService.icons();
ctrl.pages = DataService.pages();
////
//// FILTER INFORMATION
ctrl.loadIcons = function() {
console.log(ctrl.pages)
for (icon in ctrl.allIcons) {
var i = ctrl.allIcons[icon];
// console.log(i)
if(i.active){
ctrl.icons.push(i);
}
}
};
////
//// ACTIONS
ctrl.logUserOut = function(){
console.log('this is not being called')
// AuthService.logout();
};
////
});
html:
<ion-modal-view>
<ion-pane >
<ion-content scroll="false" >
<section class = "modal-container">
<div class="item modal-header">
<button class="button button-left button-icon light ion-android-close" ng-click="ctrl.closeProfileModal()"></button>
<div class="light text-center">
<button class="button button-clear" ng-click="controller.closeProfileModal()">
<img class="avatar-modal" src="img/mike.png">
</button>
</div>
</div>
<div class = "row modal-profile-row">
<div class = "col">
<button class="button button-clear">
<span class="title light">Personal Info</span>
</button>
</div>
</div>
<div class = "row modal-profile-row">
<div class = "col">
<button class="button button-clear" ng-click="ctrl.logUserOut()">
<span class="title light">Sign Out</span>
</button>
</div>
</div>
</section>
</ion-content>
</ion-pane>
</ion-modal-view>
app.js:
.state('tab.dash', {
url: '/dash',
views: {
'tab-dash': {
templateUrl: 'templates/tab-dash.html',
controller: 'DashCtrl',
controllerAs: 'ctrl'
}
}
})
EDIT:
It turns out the problem was with Sublime Text : for some reason, there was a weird cache issue - I was editing the file but the changes weren't recognized. I'm Glad that I asked because now I am using 'controllerAs:' in the $stateProvider and not 'controller: someController as something'. Thank you all for your help!

Answer 1

In your app.js change to:
.state('tab.dash', {
url: '/dash',
views: {
'tab-dash': {
templateUrl: 'templates/tab-dash.html',
controller: 'DashCtrl',
controllerAs: 'ctrl' // <-- here
}
}
})
I'll explain a little more. In your controller you set a variable to 'this'. The name you use can be anything such as wowItsAVariable = this; however when you attach your controller you can use a completely different name such as controllerAs: 'wowSomeOtherName' and that is how you reference it in your html. The name doesn't matter and I would stay away from using names such as 'controller' as that doesn't tell anyone what controller you're trying to reference. Hope that helps.