Angularjs 1.x controller not responding in directive

Question

So I am trying to separate my menu into a directive. I have a very simple controller:

function Menu(){
  self = this;
  self.tab = '';
  self.selectedTab = function(tab){
    self.tab=tab;
    console.log('setting tab');
  }
}
angular.module('app.menu')
       .controller('MenuController',Menu);

and a simple directive:

function MenuDirective(){
    return {
        templateUrl:'Menu.html',
        controller:'MenuController',
        controllerAs:'menu'
    };
}
angular.module('app.menu')
       .directive('MenuDirective', MenuDirective)

the app.menu module is included in my app.js, and my directive is on my index as <menu-directive></menu-directive>. The code in my Menu.html shows properly, but when I click on one of the links which look like <li class='menuTab' ng-class="{'active': menu.tab === '/'}"><a href="#/" class='menuAnchor' ng-click="menu.selectedTab('/')">Home</a></li>, my console log doesn't show, and my css doesn't work. Any ideas/hints? If I put it back on the index page instead of in a directive, everything is fine. Using Angular 1.5.X framework

Answer 1

Turns out it was the way I was mini-fying(?) everything. I was using gulp to bundle all of my javascript into one file, and all of my css into another, and I guess it didn't like that. I removed my bundles, and added each file separately to my index and it works fine. Thanks for the help guys.