Отключить вкладку начальной загрузки

Question

У нас есть вкладки на одной из наших страниц. То, что мы пытаемся сделать, - отключить вкладки, когда сначала загружается страница, а затем активировать их одним нажатием кнопки. Я пытался добавить «инвалид» класс при определении вкладок, на мой взгляд:

<ul class="nav nav-tabs"> 
           <li id="tbReady" role="presentation" class="disabled"><a data-toggle="tab" href="#ready" ng-click="tabClick('tbReady')">Ready to Submit</a></li> 
           <li id="tbAction" role="presentation" class="disabled"><a data-toggle="tab" href="#action" ng-click="tabClick('tbAction')">Action Required</a></li> 
          </ul> 

При загрузке страницы, они появляются отключены, но при нажатии на вкладку они снова становятся активными. Я также попытался удалить данные рычажками из определения, а затем в функции tabClick пытался вернуться ложным, но он по-прежнему не работает

$scope.tabClick = function (selTabName) { 

      if ($('#'+selTabName).hasClass('disabled')) { 
        return false; 
       } 


      if (selTabName == 'tbReady') { 
       listReadyRows($rootScope.caseFileId); 
      } else { 
       listActionRows($rootScope.caseFileId); 
      } 
      } 

Может кто-нибудь увидеть, что я делаю неправильно и мне точку в правильном направлении, пожалуйста!

Answer 1

Почему вы используете twitter bootstrap для angularjs? https://angular-ui.github.io/bootstrap/ - это модуль, который используется для создания бутстрапов, таких как (вкладки и т. Д.) В angularjs.

Почему я предлагаю это, когда вы используете twitter bootstrap в angularjs, который не будет работать все время.

Если вы используете угловой бутстрап, то Angular-ui-bootstrap -- unable to disable tabs inside ng-repeat поможет вам отключить вкладку.

Answer 2

на странице загрузки

$scope.Cssclass="enable"; 

по нажатию кнопки

$scope.tabClick = function (selTabName) { 

     if ($('#'+selTabName).hasClass('disabled')) { 
       return false; 
      } 


     if (selTabName == 'tbReady') { 
      $scope.Cssclass="Disabled"; 
     } else { 
      $scope.Cssclass="enable"; 
     } 
     } 

в HTML вы

<li id="tbReady" role="presentation" class="{{Cssclass}}"><a data-toggle="tab" href="#ready" ng-click="tabClick()">Ready to Submit</a></li> 

Я думаю, что он будет работать.