angular.js - angularjs和jquery-mobile关于前端路由冲突

浏览:30日期:2023-02-01

问题描述

目前就是刷新局部视图,jquery-mobile的某些样式会失效,需要强制刷新整个页面。如何刷新整个页面?

补充:如果使用location.replace(),先是location.replace(’page/page1.html)这样直接定位到具体位置,这样的话只会那个页面的代码,实际上那个页面是一个模板页面,那么那个模板页面就是纯HTML,无CSS部分。然后用location.replace(#page1)这样只是切换了局部视图,并没有什么效果。如果是$location.reload()那么会跳转到路由里/定义的位置,不是刷新当前页面………………如何刷新当前整个页面?或者

路由里如何配置,刷新页面是是刷新当前页面,而非跳转到首页?

如果当前页面是http://localhost:8080/#/settingF5后是http://localhost:8080/setting#/那么路由到otherwise,也就是/

原问题:angular如何刷新整个页面?

问题解答

回答1:解决过程

需要强制刷新整个页面 部分刷新是不行的就是F5的效果=====================>发现刷新后url会变化如果url不变化,那么我们使用window.reload就可以了所以要解决URL变化的问题=====================>因为页面一直报error loading page错误查了一下这个是jquery-mobile的然后屏蔽了JQM的JS和CSS文件,发现URL变化是JQM引起的查找相关的解决方案=====================>哦,如果要坚持jquery-mobile+angular就要用jqm的页面跳转。=====================>前端UI框架由jquery-mobile替换为bootstrap

结论

jqm和angular关于前端路由方面有冲突,如果坚持用jqm,那么就不能使用angular的前端路由,必须用jqm的jq写页面跳转,那样页面可能会比较杂乱。所以花了半天时间替换成了bootstrap。

回答2:

location.href? location.hash?

回答3:

如果这个不好用 就用jquery吧 你说呢

回答4:

不知道为什么,看到你的这个情况我非常想帮助你。目前我也在整合JQM与Angularjs并且有点眉目!具体就是在初始化jqm的时候配置一些参数:

$( document ).on( 'mobileinit', function() {$.mobile.page.prototype.options.domCache = false;// 关闭缓存$.mobile.initializePage = false;$.mobile.defaultPageTransition = 'fade';$.mobile.autoInitializePage = true;$.mobile.hideUrlBar = false;$.mobile.linkBindingEnabled = false;$.mobile.hashListeningEnabled = false;$.mobile.ajaxEnabled = false; });

每个配置具体参考官方的API文档。这些配置的某个是解决URL的冲突问题,就是关闭JQM的路由。

相关文章: