Angular - 下一个标签按钮

Question

以此为基础构建我的标签

http://jsfiddle.net/jccrosby/eRGT8/light/

angular.module('TabsApp', [])
.controller('TabsCtrl', ['$scope', function ($scope) {
$scope.tabs = [{
        title: 'One',
        url: 'one.tpl.html'
    }, {
        title: 'Two',
        url: 'two.tpl.html'
    }, {
        title: 'Three',
        url: 'three.tpl.html'
}];

$scope.currentTab = 'one.tpl.html';

$scope.onClickTab = function (tab) {
    $scope.currentTab = tab.url;
}

$scope.isActiveTab = function(tabUrl) {
    return tabUrl == $scope.currentTab;
}
}])

目前正在尝试实现 'Proceed' 和 'Go Back' 选项卡按钮，而不是直接单击您希望访问的按钮。

想知道是否可以实现类似

的东西

$scope.nextButton = function(tab) {
    $scope.currentTab = $scope.tabs[tab].next.url
}

我希望放置下一个按钮的位置不在

ng-repeat='tab in tabs'

不确定如何传入当前选项卡！

我们将一如既往地感谢您的帮助。

Answer 1

您可以在下面找到示例 fiddle :

https://jsfiddle.net/wyyhpo9n/

你仍然可以改进它，但你明白了

$scope.history = {};
$scope.history.tabs = [];
$scope.history.tabs.push($scope.currentTab);
$scope.history.index = 0;
$scope.history.maxIndex = 0;

$scope.previous = function() {
    if ($scope.history.index <= 0)
        return;
    $scope.history.index--;
    $scope.currentTab = $scope.history.tabs[$scope.history.index];
};
$scope.next = function() {      
    if ($scope.history.index === $scope.history.maxIndex)
       return;
    $scope.history.index++;
    $scope.currentTab = $scope.history.tabs[$scope.history.index];
};

Angular - 下一个标签按钮

Angular - Next Tab Button

javascript

tabs

angularjs