Roger_H

导航

Angular 通过路由切换模块引起的样式互相影响问题

重构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  新思路是,业务上这几个模块是完全分离地,其实没必要放在一个项目里,

        解决方式可以是这三个次根模块之间地切换可以直接打开浏览器的新标签页,从而避免样式的互相污染

  

      <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>

  

 

先这样,

以后有别的思路再说。

 

posted on 2017-12-19 19:42  Roger_H  阅读(450)  评论(0编辑  收藏  举报