Изменение Tab с помощью кнопки Нажмите

Question

<div ng-cloak> 
    <md-content> 
    <md-tabs md-dynamic-height md-border-bottom> 
    <md-tab label="one"> 
    <md-content class="md-padding"> 
     <h1 class="md-display-2">Tab One</h1>   
      <md-button class="md-raised">Save & Next</md-button> 
    </md-content> 
    </md-tab> 
    <md-tab label="two" ng-disabled="true"> 
    <md-content class="md-padding"> 
     <h1 class="md-display-2">Tab Two</h1>   
    <md-button class="md-raised">Save & Back </md-button> 
    </md-content> 
    </md-tab>  
</md-tabs> 

Я использую угловой + угловой материал, есть два меню вкладки «One» и «Two», когда я нажал на кнопку «Сохранить & Следующая» следующая вкладка должна быть enabled и foucs переходит к следующей вкладке, и все наоборот должно произойти, когда я нажал вторую вкладку «Сохранить & Назад».

Answer 1

md-selected on md-tabs показывает текущий индекс вкладок. Вы можете изменить индекс с помощью ng-click на кнопке. Должно быть что-то вроде следующего

<div ng-cloak> 
<md-content> 
    <md-tabs md-dynamic-height md-border-bottom md-selected="myTabIndex"> 
    <md-tab label="one"> 
    <md-content class="md-padding"> 
    <h1 class="md-display-2">Tab One</h1>   
     <md-button class="md-raised" ng-click="myTabIndex = myTabIndex+1">Save & Next</md-button> 
    </md-content> 
    </md-tab> 
    <md-tab label="two" ng-disabled="true"> 
    <md-content class="md-padding"> 
    <h1 class="md-display-2">Tab Two</h1>   
    <md-button class="md-raised" ng-click="myTabIndex = myTabIndex-1">Save & Back </md-button> 
    </md-content> 
    </md-tab>  
</md-tabs> 

Но вы должны теперь, если следующей или предыдущей вкладке отключена, этот метод не работает, потому что вы не можете переключиться на вкладку, которая отключена.

Answer 2

В md-tab вы можете использовать md-active="scopeName".

md-active Когда true, устанавливает активную вкладку. Примечание. Активная вкладка может быть только одной .

Создайте область scopeArray, которая содержит всю активную информацию о табуляции. И используйте его с scopeArray [index] в md-active.

Answer 3

Вы можете использовать функцию в js для изменения вкладок.

<md-button class="md-raised" ng-click="changetab('n')">Save & Next</md-button> 
<md-button class="md-raised" ng-click="changetab('b')">Save & Back</md-button> 

в .js

$scope.changetab = function(nav){ 
    if(nav == 'n') 
     $scope.myTabIndex = $scope.myTabIndex +1; 
    else 
     $scope.myTabIndex = $scope.myTabIndex -1; 
}