Angular Material md-tabs使所有选项卡切换到第一个选项卡

Question

当我启用所有选项卡时，当我禁用所有选项卡并切换回第一个选项卡时，md-tabs的默认行为会切换到最后一个选项卡。

<md-content class="md-padding">
<md-tabs md-selected="selectedIndex" md-border-bottom="" md-autoselect="">
  <md-tab ng-repeat="tab in tabs" ng-disabled="disabled" label="{{tab.title}}">
    <div class="demo-tab tab{{$index%4}}" style="padding: 25px; text-align: center;">
      <div ng-bind="tab.content"></div>
      <br>

    </div>
  </md-tab>
</md-tabs>
<md-button class="md-primary md-raised" ng-click="disabled = !disabled" ng-disabled="tabs.length <= 1">Disable/Enable</md-button>

我不想要那些。我怎么能改变这个？

由于

Answer 1

这个怎么样：

$watch selectedIndex。

var justDisabled = false;
$scope.disableTabs = function() {
  $scope.disabled = !$scope.disabled;
  justDisabled = true;
}

$scope.$watch('selectedIndex', function(newValue, oldValue) {
  if(justDisabled) {
    $scope.selectedIndex = oldValue;
    justDisabled = false;
  }
});

和标记

<md-button class="md-primary md-raised" ng-click="disableTabs()" ng-disabled="tabs.length <= 1">Disable/Enable</md-button>

现在你拥有绝对的权力（并且所有这些都在一个摘要中完成）！

http://codepen.io/astynax777/pen/NRzPEp

Answer 2

保留在同一标签上 - CodePen

标记

<md-button class="md-primary md-raised" ng-click="toggle()" ng-disabled="tabs.length <= 1">Disable/Enable</md-

JS

var currentSelection = $scope.selectedIndex;
var mySelection = 5;
$scope.toggle = function () {
    $scope.disabled = !$scope.disabled;
    $timeout(function () {
        $scope.selectedIndex = currentSelection;

        /* Or choose a selection
        $scope.selectedIndex = mySelection;
        */
    });
}