Angular 通过路由切换模块引起的样式互相影响问题
2017-12-19 19:42
260 查看
重构Angular时,设计了通过路由惰性加载各个模块,但是出现了模块间样式互相影响的问题;
appModule下共有4个模块:
login 登录 默认进入该模块,通过业务逻辑判断加载下面三个模块;
management 管理系统 引入了 ng-zorro-ant;
bigscreen 大屏,没有引入其他模块;
mobile 移动端,没有引入其他模块;
当系统加载过management模块之后,<head>标签里引入了ng-zorro的样式文件,
返回login模块后,login模块被zorro样式影响:
解决方法:
1.目前的思路是在每一次路由退出模块的时候进行刷新 window.location.reload();
2.还有一个方向是搞清楚ng-zorro的样式文件是不是只能全局加载,但是目测应该是的;
3.2017.12.21 新思路是,业务上这几个模块是完全分离地,其实没必要放在一个项目里,
解决方式可以是这三个次根模块之间地切换可以直接打开浏览器的新标签页,从而避免样式的互相污染
先这样,
以后有别的思路再说。
appModule下共有4个模块:
login 登录 默认进入该模块,通过业务逻辑判断加载下面三个模块;
management 管理系统 引入了 ng-zorro-ant;
bigscreen 大屏,没有引入其他模块;
mobile 移动端,没有引入其他模块;
当系统加载过management模块之后,<head>标签里引入了ng-zorro的样式文件,
返回login模块后,login模块被zorro样式影响:
解决方法:
1.目前的思路是在每一次路由退出模块的时候进行刷新 window.location.reload();
2.还有一个方向是搞清楚ng-zorro的样式文件是不是只能全局加载,但是目测应该是的;
3.2017.12.21 新思路是,业务上这几个模块是完全分离地,其实没必要放在一个项目里,
解决方式可以是这三个次根模块之间地切换可以直接打开浏览器的新标签页,从而避免样式的互相污染
<ul> <li><a routerLink="/management">management/管理系统</a></li> <li><a routerLink="/bigscreen" target="_blank">bigscreen/大屏</a></li> <li><a routerLink="/mobile" target="_blank">mobile/移动端</a></li> </ul>
先这样,
以后有别的思路再说。
相关文章推荐
- CSS Modules 解决 react 项目 css 样式互相影响的问题
- Flex4分模块下样式动态加载步骤及相关问题的解决
- 路由方式通过Iptables解决内网绑定的公网IP问题
- 关于java多线程中同步的问题(两个线程访问同一个实例类的两个同步方法,会不会互相影响)
- ios7 中关于导航切换影响UIScrollView的问题
- DOCTYPE引起的一系列问题-->Select样式,文本框样式width100%超过父容器
- 高性能Web服务器Nginx的配置与部署研究(12)应用模块之Memcached做文件缓存时压缩引起的问题
- Angular 中用 a 标签 href 路由时在浏览器中显示异常 "%2F" 路由失败问题
- ios7 中关于导航切换影响UIScrollView的问题
- angular ui-router 路由默认跳转语句$urlRouterProvider.otherwise(‘路径');与<a>共用时存在的问题
- IOS移动开发 应用程序互相切换问题
- 通过AndroidStudio进行静态代码检查,去除unused代码后引起的问题
- Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
- ubuntu 中英文切换引起的编码问题
- 为什么要初始化 CSS 样式 因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对 CSS 初始化往往会出现浏览器之间的页面显示差异。 当然,初始化样式会对 SEO 有一定的影响,但鱼
- angular 如何去掉a标签对路由的影响
- 通过路由管理视图间切换 - AngularJS路由解析
- angular 通过路由获取ID
- Angular通过指令动态添加组件问题
- css的position在不同手机系统的兼容问题(点击input标签弹出输入框影响样式)