18.05.2016, 12:46
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:
funktioniert nicht insofern er wenn jqm initialisiert wurde IMMER den htm5 mode verwendet.
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):
In Internetforen habe ich gelesen man solle
bereits im HEADER der Seite deklarieren.
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?
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){
$locationProvider.html5Mode({
enabled: false,
requireBase: false
});
$locationProvider.hashPrefix('#');
}else{
$locationProvider.html5Mode(false);
}
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"]');
if(0 === initialPageWrap.length){
$('body' ).wrapInner( '<div data-dom-cache="false" data-role="page" data-frdl-mod="nodesktop" id="nodesktop-'+ str_replace('.', '-', new frdl.Url().getHost()) + '-' + Sha1.hash(new frdl.Url().urlMakeNew()) + '-' + Sha1.hash(document.title) +'" style="top:0px;left:0px;right:0px;bottom:0px;height:auto;width:auto;"></div>' );
}
try{
frdl.watchFor('a[href*=":\/\/"]:not([data-flow-prepared="true"]):not([frdl-ajax-link-boddystripped])').every(function(el){
$(el).attr('data-flow-prepared', 'true')
.attr('rel', 'external');
});
$('*[data-role="page"]').page({
create: function( event, ui ) {
$.mobile.pushStateEnabled = false;
$.mobile.initializePage();
$.mobile.loading( 'hide' );
}
});
$('*[data-role="page"]').trigger('create');
$.mobile.pushStateEnabled = false;
}catch(err){
console.error(err);
}
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?