title: how to invoke controller in partial in Angular Js directive
body: <p>I have created a directive for Tab, its working fine for static controller but when add add controller to any one of the template it doesn't show anything.</p>
  
  <p>my Tab directive is here</p>
  
  <pre><code>angular.module('nsTab', [])
      .directive('nsTabset',  function() {
  
      return {
          restrict: 'E',
          scope: {
              tabs: '=tabs'
          },
          transclude: true,
          link: function($scope, element, attributes) {
                $scope.currentTab = $scope.tabs[0].url;
  
          },
          controller: function($scope, $element){
  
              $scope.activateTab = function(tab){
  
                  $scope.currentTab  = tab.url;
              }
          },
          templateUrl: 'modules/common/views/tabset.html'
      };
  });
  </code></pre>
  
  <p>local scope</p>
  
  <pre><code>$scope.tabs = [
      {name: 'Headends', url: 'modules/lineup/views/ShowSystem/head.html', isActive: true},
      {name: 'Contacts', url: 'modules/lineup/views/ShowSystem/contacts.html'}
  ]
  </code></pre>
  
  <p>directive in html</p>
  
  <pre><code>&lt;ns-tabset tabs="tabs"&gt;&lt;/ns-tabset&gt;
  </code></pre>
  
  <p>content of head.html</p>
  
  <pre><code>&lt;div ng-controller="HeadCtrl"&gt;{{value}}&lt;/div&gt;
  </code></pre>
  
  <p>SystemHeadendCtrl.js</p>
  
  <pre><code>angular.module('myMod').controller('HeadCtrl', function($scope, Restangular) {
      $scope.headendList = function(){
          $scope.myData = [{name: "Moroni", age: 50},
                           {name: "Tiancum", age: 43},
                           {name: "Jacob", age: 27},
                           {name: "Nephi", age: 29},
                           {name: "Enos", age: 34}];
          $scope.value= 10;
          $scope.gridOptions = { data: 'myData' };
      }
  });
  </code></pre>
  
  <p>well its not showing anything in head.html when that tab is active.</p>