title: Disable a Tab in angularjs
body: <p>I have created a demo  at plnkr. I want to disable a particular tab say migration, I tried by writing disabled: true but it doesn't seem to work.</p>
  
  <p><a href="http://plnkr.co/edit/0XgquovKIICmgGcSVSef?p=preview" rel="nofollow">http://plnkr.co/edit/0XgquovKIICmgGcSVSef?p=preview</a>
  html code:</p>
  
  <pre><code>&lt;!doctype html&gt;
  
  &lt;div ng-app="TabsApp"&gt;
    &lt;head&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.js"&gt;&lt;/script&gt;
      &lt;script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.6.0.js"&gt;&lt;/script&gt;
      &lt;script src="example.js"&gt;&lt;/script&gt;
      &lt;link href="punk.css" rel="stylesheet"&gt;
    &lt;/head&gt;
    &lt;body&gt;
  
  &lt;div id="tabs" ng-controller="TabsCtrl"&gt;
          &lt;ul&gt;
              &lt;li ng-repeat="tab in tabs" 
                  ng-class="{active:isActiveTab(tab.url)}" 
                  ng-click="onClickTab(tab)"&gt;{{tab.title}}&lt;/li&gt;
          &lt;/ul&gt;
          &lt;div id="mainView"&gt;
              &lt;div ng-include="currentTab"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Controller code :</p>
  
  <pre><code>angular.module('TabsApp', [])
  .controller('TabsCtrl', ['$scope', function ($scope) {
      $scope.tabs = [{
              title: 'One',
              url: 'coredcplan.html',
  
          }, {
              title: 'Two',
              url: 'migration.html',
             disabled: true,
          }, {
              title: 'Three',
              url: 'schedule.html',
  
  
      }];
  
      $scope.currentTab = 'coredcplan.html';
  
      $scope.onClickTab = function (tab) {
          $scope.currentTab = tab.url;
      }
  
      $scope.isActiveTab = function(tabUrl) {
          return tabUrl == $scope.currentTab;
      }
  }]);
  </code></pre>