title: Clicking on angular ui tabs fires event many times
body: <p>I have 15 tabs using angular ui tabs like this</p>
  
  <p>This is template</p>
  
  <pre><code>&lt;tabset justified="true"&gt;
      &lt;tab heading="{{ tab.display }}"
           select="tsc.selectTab(tab.date)"
           ng-repeat="tab in tsc.tabs"&gt;
           &lt;div ng-include="'entries.html'"&gt;&lt;/div&gt;
      &lt;/tab&gt;
  &lt;/tabset&gt;
  </code></pre>
  
  <p>This is controller</p>
  
  <pre><code>$scope.activeTabDate = '';
  
  self.selectTab = function (tabDate) {
      $scope.activeTabDate = tabDate;
  
  };
  </code></pre>
  
  <p>Now This is my child controller for entries.html</p>
  
  <pre><code>$scope.$parent.$watch('activeTabDate', function (newValue, oldValue) {
      if (newValue !== oldValue) {
          console.log('--'+newValue);
      }
  });
  </code></pre>
  
  <p>I have 15 Tabs on the Page. My problem is everytime i click on tab . In console.log i get 15 entries instead of one. Why is that</p>