angularJS ui.router und jQuery mobile - Druckversion +- PHP Rocks (https://www.php-rocks.de) +-- Forum: HTML, CSS, Usability und Barrierefreiheit (https://www.php-rocks.de/https://www.php-rocks.de/forum/11-html-css-usability-und-barrierefreiheit.html) +--- Forum: JavaScript / JavaScript Frameworks / Ajax (https://www.php-rocks.de/https://www.php-rocks.de/forum/13-javascript-javascript-frameworks-ajax.html) +--- Thema: angularJS ui.router und jQuery mobile (/https://www.php-rocks.de/thema/99-uirouter-und-jquery-mobile.html) |
ui.router und jQuery mobile - Till - 18.05.2016 Hallo, so, mit dem ui.router (siehe anderer Thread) bin ich nun weiter und hab es begriffen. Jetzt habe ich ein Problem mit ui.router in Verwendung mit jQuery mobile: Code: if(false===navigator.isDesktop){ Zur Info: Im html5 Modus wird der "pushState flow" verwendet, die URL wird also als "echte" URL aufgerufen und nicht als #hash anker. Auf der Testseite kann man sehen was ich meine, wenn man sie jeweils mit einem Desktop device oder einem mobile device aufruft: http://test.freizeittreffen.de/pmx/ (Bei Verwendung von device emulator ist ein cache refresh erforderlich!) Um den jqm push state modus zu vermeiden (für solche Fälle nutze ich meine eigene direktive http://www.jsclasses.org/blog/package/445/post/1-Fast-Migration-of-Regular-Sites-to-Mobile-using-Flow-Library.html ) hänge das rel="external" attribut an ausgehende links. Dies funktioniert auch ganz gut, solange ich nicht den angular ui.router verwende. Also: - jqm geht - ui.router geht - beides zusammen -> conflict Meine jqm initialisierung sieht so aus (wird aufgerufen wenn KEIN desktop device): Code: var initialPageWrap = frdl.$q('body *[data-role="page"]'); In Internetforen habe ich gelesen man solle Code: <script> $.mobile.pushStateEnabled = false;</script> Das $.mobile wird allerdings bei mir asynchron geladen per $.lazy http://unwrongest.com/projects/lazy/ geladen und jqm wird (wenn erforderlich) erst initialisiert wenn DOMContentLoaded. Eine Verwendung von $.mobile im Header würde jqm zu früh und ungewollt laden! Ich habe versucht das "normale Verhalten zu emulieren" indem ich das ui.router url prefix lösche und $locationProvider.hashPrefix('#'); als hash prefix setzte. Dies funktioniert zum einen nicht und ist zum anderen auch keine saubere Lösung. Zusammenfassung: Wie kann ich $.mobile.pushStateEnabled = false; erzwingen? RE: ui.router und jQuery mobile - Arne Drews - 18.05.2016 Hallo Till, Bei mir ist die Testseite auf allen Devices leer und die Konsole sagt das: Ausgabe: Uncaught SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode RE: ui.router und jQuery mobile - Till - 18.05.2016 Bei mir funktioniert es nun wie gewünscht, wenn ich die pushState config einfach auskommentiere, wie folgt: Code: if(true===frdl.UI.isMobileTheme){ Zitat:Bei mir ist die Testseite auf allen Devices leer und die Konsole sagt das:Mh, Mist! Danke für die INfo! (Jemand eine Idee dazu? Ich denke ich muß dazu einen neuen Thread aufmachen, @Arne mfg RE: ui.router und jQuery mobile - Till - 18.05.2016 Zitat:Bei mir funktioniert es nun wie gewünscht, wenn ich die pushState config einfach auskommentiereKlappt doch noch nicht so ganz! RE: ui.router und jQuery mobile - Arne Drews - 19.05.2016 Hallo Till, Hier meine Konsole: [Bild: http://www.php-rocks.de/uploads/webfan-console.jpg] Ich habe mir das nicht intensiv angesehen, muss ich zugeben, da ich bisher wenig mit AngularJS gemacht habe, aber vielleicht hilft es Dir? Schöne Grüße Arne RE: ui.router und jQuery mobile - Till - 19.05.2016 Hallo Arne, erstmal vielen Dank für Deine Hile! [object FileError] sollte nun behoben sein!?! (chrome fileSystem API shim) Die DOMExceptio tritt bei mir so nicht auf, muß ich nochmal untersuchen...!? Ich habe es jetzt so: Code: if(true===frdl.UI.isMobileTheme){ Code: var initialPageWrap = frdl.$q('body *[data-role="page"]'); Der hashPrefix wird so verdoppelt ## und bei den href links bereinigt #. Zumindest habe ich nun erreicht, daß nun keine 404 Seite mehr kommt, die Lösung ist allerdings, nunja unschön. ... Viele Grüße Till RE: ui.router und jQuery mobile - Till - 25.05.2016 Ich denke so geht es nun (bisher keine Fehler): $.extend( $.mobile , frdl.UI.o.jQueryMobile.o); }); Code: $( window ).one( "mobileinit", function() { |