AngularJS mit bootstrap 3 Akkordeon funktioniert nicht, wenn über ng-view

Das problem ist Folgendes: sobald ich das Akkordeon in einer Ansicht, die geladen wird, in die ng-view-Direktive, die Akkordeon Titel Klicks funktionieren nicht mehr korrekt

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

Wenn das Akkordeon Verwendung in der Seite selbst keine ng-view, das Akkordeon funktioniert einwandfrei

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

Keine Ahnung, was Im fehlt?

InformationsquelleAutor Stephan Grobler | 2013-09-14

  1. 7

    Das problem ist, dass Bootstrap hängt #according_name innerhalb einer a tag. Dies löst einen AngularJS routing und aufgrund der Strecke ändern test.html geladen ist wieder bei jedem Klick auf Akkordeon-link.

    Sind Ihre Optionen, um zu versuchen zu konfigurieren $locationProvider zu HTML5-Modus mit hashbag wenn es funktioniert

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

    Sehen Sie einige Unterlagen hier

    Andere wäre, die Nutzung angular-ui Komponente, aber es wurde nicht portiert, um die Unterstützung der version 3 von bootstrap.

    Hey, ich habe die .html5Mode auf false gesetzt und jetzt funktioniert es! vielen Dank 🙂
    Sieht aus wie in der Dokumentation, die Sie Hinzugefügt haben, nicht mehr verfügbar ist. Könntest du einen anderen link?
    überprüfen Sie jetzt.
    danke.

    InformationsquelleAutor Chandermani

  2. 35

    Tatsächlich, es gibt vielleicht eine einfachere Lösung.

    Können Sie genau stellen Sie sicher, dass die links nicht weitergeben der URL ändern.

    Hinzufügen, um die a tag onclick="return false;"

    Dieser arbeitete für mich. Es ist vielleicht nicht die beste Vorgehensweise, aber ich Hänge schon länger mit diesem für ein paar Stunden jetzt. Danke @mfloryan!
    Sie müssen nur gelöst, was ich habe gekämpft, für Stunden. Danke!!! Guten Fang.
    Das nennt man Lösung. Vielen Dank 🙂

    InformationsquelleAutor mfloryan

  3. 15

    Können Sie leeren die href="" und verwenden

    data-target="#collapse" statt, dies war für mich

    ich.e 

    <a data-toggle="collapse" data-parent="#accordion" href="" 
data-target="#collapse1">Collapsible Group 1</a>
    +10 wenn ein könnte. Dies sollte die akzeptierte Antwort! Non-intrusive im Allgemeinen app-Konfiguration als html5Mode und eine gute übung mit dem gleichen Attribut für andere ähnliche Komponenten
    Nach dem Versuch viele Dinge, das war die Lösung für mich!
    +1 Das hat mir sehr geholfen, ich war immer seltsame Verhalten mit meinem Akkordeon auch nach dem Wechsel in den html5-Modus (und umschreiben meine expressJS urls) -- hinzufügen von data-target und entleeren mein href beseitigt alle ungeraden Akkordeon-Verhalten-danke sehr!

    InformationsquelleAutor Sreekanth Karini

  4. 0

    Ich hatte ein Problem mit href und data-target zusammen, also, wenn Sie dies in einer Anwendung würde ich empfehlen die Angabe eines oder das andere, aber nicht beide.

    Wenn ich beide, würde ich umgeleitet auf meiner login-Seite, sobald ich darauf geklickt. Mit dem einen oder dem anderen festgelegten funktionierte es gut, aber nicht mit beiden.

    InformationsquelleAutor Matt E

Schreibe einen Kommentar