2016-12-21 16 views
0

Angularjsブートストラップタブコンポーネント用のuiルータを作成しようとしています。私はページにコンテンツを表示する際に問題があります。以下は私のコードですuirouterを持つ角度jsブートストラップタブ

<div class="container" style="height: 530px;margin-top: 5%;"> 
    <ul class="nav nav-tabs"> 

     <li><a data-toggle="tab" href="#menuh1">Testing</a></li> 
     <li><a data-toggle="tab" data-target="#bhistory" ng-click="_redirect('bhistory');">History</a></li> 
    </ul> 
<div class="tab-content" style="height: 100%;border: 1px #ddd solid;"> 
    <div id="menuh1" class="tab-pane fade">  
    </div> 
    <div id="bdhistory" class="tab-pane fade" > 
    </div> 
    </div> 
    </div> 

上記のコードは、タブと私のコントローラで、ルーティングされる状態を更新しています。以下はコントローラコード

var navtabs = angular.module("HValidationModule", []).config(
     function($httpProvider) { 
     $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'; 
    }).controller("HValidationController", function($scope, $http, $location, $state) { 


$scope._redirect = function(caseStr) { 
    $("#" + $scope.currentActiveTab).removeClass('active'); 
    $("#" + caseStr).addClass('active'); 
    $scope.currentActiveTab = caseStr; 
    $state.go("bdata."+caseStr); 

}; 
}); 

以下はルータの状態を示すコードです。

.state(
         'bdata.bhistory', 
         { 
          url : '/bhistory', 
          templateUrl : '', 
          controller : 'historyController', 
          resolve : { 
           redirectIfNotAuthenticated : _redirectIfNotAuthenticated 
          }, 
          views : { 
           '' : { 
            templateUrl : './resources/app/components/BValidation/HSystem/HHistoryView.html' 
           }, 
          } 
         }) 

履歴]タブの[I]をクリックすると、アプリケーションのURLは、上記の状態を指摘します。しかし、HHistoryView.htmlファイルのデータは画面にロードされません。これに関する助けは大いに感謝しています。

+0

私はそれが質問に答えることはできませんが、ホイールを再発明せずにhttps: /angular-ui.github.io/bootstrap/#/tabs。 –

+0

ブラウザのデバッグコンソールにエラーはありますか? – Troopers

答えて

0

templateUrlを.stateから削除してください。 ところでjquery-bootstrapにはさまざまな問題があります/ ui-bootstrapには何もありません