AngularJS с бутстрапом 3 аккордеона не работает при включении через ng-view - программирование
Подтвердить что ты не робот

AngularJS с бутстрапом 3 аккордеона не работает при включении через ng-view

Проблема заключается в следующем: как только я использую аккордеон в представлении, которое загружается в директиве ng-view, клики названия аккордеона не работают корректно больше

http://plnkr.co/edit/KGwuqDIb7I5NrYCtPOPk?p=preview

Если аккордеон используется на самой странице без ng-view, аккордеон отлично работает

http://plnkr.co/edit/8dY7JU1kxjZ2jAKmMIrP?p=preview

Любая подсказка к тому, что Im отсутствует?

4b9b3361

Ответ 1

Проблема заключается в том, что Bootstrap добавляет #according_name в тег a. Это запускает маршрутизацию AngularJS и из-за изменения маршрута test.html загружается снова при каждом нажатии на аккордеонную ссылку.

Ваши параметры должны попытаться настроить $locationProvider на использование режима HTML5 с hashbag, если он работает

$locationProvider.html5Mode(true).hashPrefix('!');

См. документацию здесь

Другим было бы использовать компонент angular-ui, но он не был перенесен на поддержку версии 3 загрузочного файла.

Ответ 2

На самом деле может быть более простое решение.

Вы можете просто убедиться, что ссылки не распространяют изменение URL.

Добавить в тег a onclick="return false;"

Ответ 3

Вы можете очистить href="" и использовать

data-target="#collapse", это сработало для меня

i.e

<a data-toggle="collapse" data-parent="#accordion" href="" 
data-target="#collapse1">Collapsible Group 1</a>

Ответ 4

У меня возникла проблема с использованием href и target-данных вместе, поэтому, если вы используете это в приложении, я бы рекомендовал указать один или другой, но не оба.

Когда я использовал оба варианта, я бы перенаправился на мою страницу входа, как только я нажал на нее. С одним или другим указанным он работал нормально, но не с обоими.