2016-04-05 5 views
0

タブを選択すると角になり、固定されます。私は、angularJSで<tabset><tab>を使用しようとしています.HTMLで特定のTABを押すと、ng-clickで関数を呼び出そうとしています。ただし、何らかの理由でメソッドが呼び出されず、選択したタブを印刷できません。ここで何が不足しているAngularJS ng-repeat <tab>でng-クリックしてタブを選択

<div class="wrapper wrapper-content animated fadeIn"> 
<div class="row wrapper border-bottom white-bg page-heading"> 
    <div class="col-lg-10"> 
     <h1 style="text-align:center">Submitted Deliveries</h1> 
    </div> 
</div> 
<br> 
<div class="row"> 
    <div class="col-lg-12"> 
     <div class="tabs-container"> 

      <tabset> 
       <tab ng-repeat="priority in vm.priorities" ng-click="vm.setTab(priority)" heading={{priority}}> 
        <div class="panel-body"> 
         <delivery-directive></delivery-directive> 
        </div> 
       </tab> 
      </tabset> 

     </div> 
    </div> 
</div> 

</div> 
// Controller 
(function() { 

'use strict'; 

angular.module('app.deliveries') 
     .controller('DeliveriesController', DeliveriesController); 

DeliveriesController.$inject = ['DeliveriesService', 'APP_CONFIG', '$interval', 'WorkspaceService']; 

function DeliveriesController(deliveriesService, APP_CONFIG, $interval, workspaceService){ 

    var vm = this; 
    vm.priorities = [];  // priorities are based the names of each workspace. 
          // So call the workspace end point from the workspaceService 
          // to get a list of all workspace. Then assign it to the priorities. 

    vm.setTab = setTab; 

    return init(); 

    function init(){ 
     workspaceService.getWorkspaces().then(function(workspaceResponse){ 
      vm.priorities = workspaceResponse; 
     }); 
    } 

    // This function does not get called and doesn't print anything 
    function setTab(priority){ 
     console.log(priority); 
    } 
} 

})(); 

任意の提案を:ここにコードがありますか?

答えて

0

angle-uiなどのタブセットとタブにディレクティブを使用していますか?もしそうなら、あなたがあなたがクリックしていると思っているのと同じDOMノードではなく、あなたがクリックしているものが移動しているように、ドムノードが移動している可能性があります。それが今、私が試した

<uib-tabset> 
    <uib-tab ng-repeat="priority in vm.priorities" select="vm.setTab(priority)" heading="{{priority}}">...</uib-tab>  
</uib-tabset> 
+0

になるような角度-UIがuib-接頭辞を使用して、最新バージョンの、:

<tabset> <tab ng-repeat="priority in vm.priorities" select="vm.setTab(priority)" heading="{{priority}}">...</tab> </tabset> 

注:角度UIのタブは、あなたが使用するselectイベントハンドラを持っていますそれ。まだ結果に変化はありません。私のコントローラの 'vm.setTab'メソッドにヒットしません。はい、カスタムディレクティブを使用しています。あなたがHTMLの下を見ているなら<配送指示>はカスタムの指示です – noobcoder

+0

あなたは角度のタブの指示を使っていますか? – mcgraphix

+0

angle-uiタブディレクティブ。タブのカスタムを何も使用していません – noobcoder

関連する問題