Directive can use another directive though 'require' keyword. 

 

angular.module('docsTabsExample', []).directive('myTabs', function() {  return {    restrict: 'E',    transclude: true,    scope: {},    controller: function($scope) {      var panes = $scope.panes = [];      $scope.select = function(pane) {        angular.forEach(panes, function(pane) {          pane.selected = false;        });        pane.selected = true;      };      this.addPane = function(pane) {        if (panes.length === 0) {          $scope.select(pane);        }        panes.push(pane);      };    },    templateUrl: 'my-tabs.html'  };}).directive('myPane', function() {  return {    require: '^myTabs',    restrict: 'E',    transclude: true,    scope: {      title: '@'    },    link: function(scope, element, attrs, tabsCtrl) {      tabsCtrl.addPane(scope);    },    templateUrl: 'my-pane.html'  };});

 

The myPane directive has a require option with value ^myTabs. When a directive uses this option, $compile will throw an error unless the specified controller is found. The ^ prefix means that this directive searches for the controller on its parents (without the ^ prefix, the directive would look for the controller on just its own element).