AngularJS ng-repeat在<tab>中用ng-click選擇標籤

Question

新增到Angular並卡住選項卡選項。我試圖在angularJS中使用<tabset>和<tab>，並試圖在我點擊HTML中的給定TAB時調用ng-click函數。但是，由於某種原因，該方法沒有被調用，我也無法打印出我選擇了哪個選項卡。下面是代碼：

<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); 
    } 
} 

})(); 

任何建議，這到底是怎麼失蹤了？

Answer 1

你是否使用tabset和tab等指令，如angular-ui？如果是這樣，有可能，dom節點正在移動，使得您點擊的東西與您認爲您點擊的DOM節點不同。對於角度的用戶界面，標籤有選擇的事件處理程序可以使用：

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

注：角UI的最新版本使用uib-前綴，以至於現在將

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