Ответ 1
Решение так же просто, как замена атрибута href с помощью цели данных. Это решает проблему:
<li><a data-target="#additionalSelection" data-toggle="tab">Additional Selection</a></li>
Закладки Bootstrap с переключением данных вызывают перезагрузку в angularjs
Я только что перешел на AngularJS 1.2. И я понял, что все элементы меню/навигации, которые были настроены с помощью переключения данных, например:
<li><a href="#additionalSelection" data-toggle="tab">Additional Selection</a></li>
больше не работают. Они должны переключать элемент с id = "extraSelection" - и вот как Angular и Bootstrap работали, когда я использовал версию 1.0.8 Angular.
Но теперь, когда я нажимаю элемент привязки, Angular перехватывает этот клик и пытается перейти на маршрут дополнительныйSelection, и он вызывает обновление страницы...
Есть ли способ исправить это?
Ответы
Ответ 2
Как указывал dragonfly, data-target работает отлично, а не href.
В CSS есть небольшая разница. Если используется цель данных vs href, курсор больше не является указателем . Если вы не хотите добавлять дополнительные CSS, вы можете сделать следующее:
<a href="#additionalSelection" data-toggle="tab" onclick="return false;">Selection</a>
Это просто предложение, а не элегантное решение. Но если вы хотите использовать href по какой-либо причине, добавьте
onclick="return false;"
Ответ 3
Просто замените атрибут href data-target
<li><a data-target="#switchTabs" data-toggle="tab">Tabs</a></li>
Ответ 4
Решение, сохраняющее курсор (в то время как все еще полагается на цель данных вместо href для навигации):
<li><a href="" data-target="#additionalSelection" data-toggle="tab">Additional Selection</a></li>
добавление href заставляет курсор переключиться на руку, но оставляет его пустым, поскольку "" не вызывает перезагрузки страницы.