javascript - 动态制作除第一个和最后一个选项卡之外的选项卡

Question

我必须创建选项卡，第一个和最后一个选项卡是固定的，中间的选项卡根据数据填充。

我陷入困境，无法弄清楚如何将索引设置为我的最后一个选项卡。代码如下:

<div ng-click="changeConTab(0)" ng-class="{ 'active-tab': activeConTab == 0 }">Example Tab First</div>

<div ng-click="changeConTab($index + 1)" ng-class="{ 'active-tab': activeConTab == $index + 1}" ng-repeat="contact in someModel.Info">{{ $index + 1 }} Something in between</div>

<div ng-click="changeConTab(???)" ng-class="{ 'active-tab': activeConTab == ??? }">Example Tab Last</div>

TS:

$scope.activeConTab = 0;
$scope.changeConTab = function (selectedCon) {
    $scope.activeConTab = selectedCon;
}

Answer 1

您可以使用任何常量字符串，例如:

<div ng-click="changeConTab('last')" ng-class="{'active-tab': activeConTab == 'last'}">
    Example Tab Last
</div>

使用数字风险更大，因为它可能会被 ng-repeat 生成的元素使用(好吧，我猜你不会有 100 个选项卡，所以使用 100 也可能有效)。