Угловая - кнопка «Следующая вкладка»

0

Используя это как основу для создания моих вкладок

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;
}
}])

и в настоящее время пытается реализовать кнопки "Продолжить" и "Назад", вместо того, чтобы прямо нажимать на тот, который вы хотите посетить.

Интересно, можно ли реализовать что-то вроде

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

Где я хочу разместить свою следующую кнопку, не будет

ng-repeat='tab in tabs'

поэтому не уверены, как пройти на текущей вкладке!

Любая помощь будет высоко оценена, как всегда.

Теги:
tabs

1 ответ

0
Лучший ответ

Вы можете найти пример в следующем скрипте:

https://jsfiddle.net/wyyhpo9n/

Yo ucan все еще улучшает его, но вы получаете идею

$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];
};
  • 0
    Так хорошо, спасибо большое!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню