Directive with controller as

controller-as-directive.js

.directive('tabs', function() {
  return {
    restrict: 'E',
    transclude: true,
    scope: {},
    controllerAs: 'tabs',
    controller: [function TabsController() {
      var tabs = this;
      var panes = tabs.panes = []
      tabs.select = function(pane) {
        angular.forEach(panes, function(p) {
          p.selected = false;
        });
        pane.selected = true;
      };
      tabs.addPane = function(pane) {
        if (panes.length === 0) {
          tabs.select(pane);
        }
        tabs.panes.push(pane);
      };
    }],
    templateUrl: 'tabs.html'
  };
})
.directive('tab', function() {
  return {
    require: '^^tabs',
    restrict: 'E',
    transclude: true,
    scope: {},
    bindToController: {
      details: '<'
    },
    controllerAs: 'tab',
    link: function(scope, element, attrs, tabsCtrl) {
      tabsCtrl.addPane(scope.tab.details);
    },
    // controller is required to use bindToController
    controller: function() {},
    templateUrl: 'tab.html'
  };
});