Uib-tab沒有渲染任何東西

Question

UIb-tab沒有顯示任何東西。簡單的「標籤」工作得很好，但一個場景來了，他們失敗了，所以我不得不切換到uib-tabs.Below是我的代碼和版本我用在我的項目中。

<div class="ui-tab-container"> 
    <uib-tabset active="currentTabIndex"> 
    <uib-tab heading="Region Wise" index="0" classes="my-tab" style="border: 1px solid #e9e9e9;"> 
     <br> 
     <br> 
     <table class="table table-hover table-striped table-bordered" ng-hide="mydata.length==1" ng-if="mydata.length>1"> 
     <thead style="background:lightskyblue;color:#ffffff"> 
      <!--<th>SL No</th>--> 
      <th>Region</th> 


      <th>RE Count</th> 

      <th ng-repeat="sale in mydata[0].cat_wise_sale | orderBy:'cat'">{{sale.cat}}</th> 
      <th>Total</th> 

      <th>Target</th> 
      <th>Achievement</th> 
     </thead> 
     <tbody> 
      <tr ng-repeat="ant in mydata | filter:textToSearch"> 
      <!--<td>{{$index+1}}</td>--> 
      <td ng-if="ant.region!='Total'"><a href ng-click="region_selected(ant.region)">{{ant.region}}</a> 
      </td> 
      <td ng-if="ant.region=='Total'">{{ant.region}}</td> 
      <td>{{ant.total_re}}</td> 

      <td ng-repeat="sale in ant.cat_wise_sale | orderBy:'cat'">{{sale.sale}}</td> 
      <td>{{ant.total_sale}}</td> 

      <td>{{ant.target_qty}}</td> 
      <td>{{ant.achievement}}</td> 

      </tr> 

     </tbody> 
     </table> 
    </uib-tab> 
    <uib-tab heading="Branch Wise" index="1" classes="my-tab" style="border: 1px solid #e9e9e9;" active="state_tab"> 

    </uib-tab> 
    <uib-tab heading="City Wise" index="2" style="border: 1px solid #e9e9e9;" classes="my-tab" active="city_tab"> 

    </uib-tab> 
    <uib-tab heading="Counter Wise" index="3" style="border: 1px solid #e9e9e9;" classes="my-tab" active="counter_tab"> 

    </uib-tab> 
    </uib-tabset> 
    <loading-data class="" ng-show="loading"></loading-data> 
    <br> 
    <br> 
    <br> 
</div> 

安裝的版本 「角度」： 「〜1.5.6」

「角自舉」： 「〜2.3.1」

「角-UI-自舉」：「2.3 .1"

<script src="bower_components/angular/angular.js"></script> 
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script> 

Answer 1

1. 你有沒有安裝角UI

2. 使用NG-如果選項卡，使它們

3. 而且，由於〜角1.5，應使用標籤UIB-標籤集，UIB標籤，UIB標籤，標題

這裏是參考代碼爲你檢查你安裝的所有東西： -

<link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.3.2.js"></script> 



    <uib-tabset> 
    <uib-tab heading="Test1" ng-if=hideCharts index="1"> 
     <nvd3 options="options" data="data"></nvd3> 
    </uib-tab> 
    <uib-tab heading="Test2" ng-if=hideCharts index="2"> 
     <nvd3 options="options" data="data1"></nvd3> 
    </uib-tab> 
    <uib-tab heading="Test3" ng-if=hideCharts index="3"> 
     <nvd3 options="options" data="data2"></nvd3> 
    </uib-tab> 
    <uib-tab heading="Test4"> 
     <div id="grid1" ui-grid="gridOptions" ui-grid-grouping class="grid"></div> 
    </uib-tab> 
    </uib-tabset>