带有 ng-hide 的 Md 选项卡 - 保持先前选择的选项卡处于活动状态

Question

我正在处理一组选项卡，其中有要动态隐藏和显示的选项卡。

问题是当一个选项卡从隐藏变为可见时，它变成了选中的选项卡。我希望在显示选项卡后仍然选择之前选择的选项卡。

这是一个简单的例子。在这种情况下，如果 "Three" 被选中，我点击按钮显示 "Two" 选项卡，我希望 "Three" 仍然被选中。

https://jsfiddle.net/b5aw533a/2/

这是我如何尝试使用 md-active 实现此目的的示例

https://jsfiddle.net/pspL9c7s/1/

Answer 1

你的问题是 $scope.selectedTab 等于 2，这是所选选项卡的索引。

当您添加新标签时，您应该相应地更新$scope.selectedTab。

基本上，如果您在所选选项卡之前添加一个选项卡，则应将所选选项卡的索引递增 $scope.selectedTab++。如果之后出现新标签页，则您不必这样做。

$scope.showTab = function() {
  // we add a tab before, so we update the index of the selected one
  $scope.selectedTab++;
  $scope.shouldShow = true;
}

https://jsfiddle.net/v8jL75tf/

带有 ng-hide 的 Md 选项卡 - 保持先前选择的选项卡处于活动状态

Md tabs with ng-hide - keep the previously selected tab active

tabs

angularjs

angular-material