Установить индексы вкладок для ng-повторных вкладок и других элементов div

Question

У меня есть требование в моем проекте. У меня вкладки загружаются в переменную области из HTTP-вызова в зависимости от вошедшего в систему пользователя:

Предположим, для данных User1:

$scope.tabObject = [{  
     "tabid": "1",
     "tabname": "tab1" }, {  
     "tabid": "2",
     "tabname": "tab2" }];

Предположим, для данных User2:

$scope.tabObject = [{  
     "tabid": "1",
     "tabname": "tab1" }, {  
     "tabid": "2",
     "tabname": "tab2" },{  
     "tabid": "3",
     "tabname": "tab3" }, {  
     "tabid": "4",
     "tabname": "tab4" }];  

В дополнение к этим N количество вкладок (с использованием угловых ng-repeat) есть и другие div'ы. Пользователи увидят страницу следующим образом:

Экран User2:
tab1 tab2 tab3 tab4 выход из системы (кнопка)
панель1 панель1
панель2 панель2
* предположим, что здесь tab2 выбран по умолчанию

Пользователь2 находится на вкладке 2 после загрузки страницы, поэтому, когда пользователь нажимает клавишу Tab на клавиатуре, нам необходимо перейти к следующей вкладке 3, вкладке 4, затем выйти из системы, а затем к панелям в зависимости от выбранной вкладки. И если я нажму Shift+ Tab, то нужно сосредоточиться назад.

Я пытаюсь сделать это с помощью tabindex, но безуспешно. Как я могу получить порядок вкладок для работы?

Answer 1

Изменение фокуса для html-элемента не означает, что он будет активирован или кликнут так, как вы ожидаете.

Вы можете принудительно выполнить действие в своем собственном коде JavaScript, если вы связываетесь с onfocus событие. В угловых вы можете использовать ng-focus директива для выполнения необходимых действий. В этом случае при нажатии tab и фокусировке tab1 будет вызвано выражение tab2 (вы определите вызов функции). Например, если вы определили состояния в вашем приложении, вы можете сделать как <a ng-focus="$state.go('tab2')"> Tab2 </a>