如何讓md-tab無法點擊？

Question

如何讓md-tab在angularJS上無法點擊？我不希望禁用的標籤內容，而只是希望通過單擊選項卡上，使md-tab不可點擊，因此用戶無法通過瀏覽這些頁面：

這是我的代碼：

<md-content class="md-padding" > 
    <md-tabs md-dynamic-height="" md-border-bottom="" md-selected="selectedIndex"> 
     <md-tab label="one"> 
     <md-content class="md-padding"> 
      <h1 class="md-display-2">Tab One</h1> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla venenatis ante augue. Phasellus volutpat neque ac dui mattis vulputate. Etiam consequat aliquam cursus. In sodales pretium ultrices. Maecenas lectus est, sollicitudin consectetur felis nec, feugiat ultricies mi.</p> 
      <md-button class="md-raised md-primary" ng-click="nextTab()">Next</md-button> 
     </md-content> 
     </md-tab> 
     <md-tab label="two"> 
     <md-content class="md-padding"> 
      <h1 class="md-display-2">Tab Two</h1> 
      <p>Lorem risus, pulvinar at interdum quis, vehicula sed odio. Phasellus in enim venenatis, iaculis tortor eu, bibendum ante. Donec ac tellus dictum neque volutpat blandit. Praesent efficitur faucibus risus, ac auctor purus porttitor vitae. Phasellus ornare dui nec orci posuere, nec luctus mauris semper.</p> 

      <md-button class="md-raised md-primary" ng-click="nextTab()">Next</md-button> 
     </md-content> 

     </md-tab> 

    </md-tabs> 
    </md-content> 

Answer 1

我找到了解決方案。

從<md-tab>開始使用ng-disabled = "true"，並在用戶點擊下一個按鈕時啓用它。

Answer 2

在文檔中，您有禁用第二個選項卡（不可點擊）的示例：https://material.angularjs.org/latest/demo/tabs。

 <md-tab id="tab2" ng-disabled="data.secondLocked"> 
     <md-tab-label>{{data.secondLabel}}</md-tab-label> 
     <md-tab-body> 
      ... 
     </md-tab-body> 
     </md-tab> 

Answer 3

使用md-no-select-click上md-tabs屬性達到的效果。

來源： https://material.angularjs.org/1.1.4/api/directive/mdTabs