10.15 tab-control逻辑回顾

emmmmm,现在变成开发冷链车监控系统了，说白了就是地图。

但是目前这个网页的布局地图模块的位置太小了，想重新整改一下，研究了好久tab-control模块，涉及到组件之间交互，主要在子组件和父组件间，同等组件之间的可能要用subscribe了吧......父子组件交互有@input，@Output，@ChildView，还有各种ViewContainerRef，ElementRef，TemplateRef.....不懂不懂

整个页面加载的顺序和逻辑应该是这样的：

登录后召唤dashboard组件，组件模板里有header、region-panel区域、报警模块、gps模块、tab-control模块。tab-control比较特殊是在dashboard控制的

dashboard.html里有一行<app-tab-control #tabCtrl></app-tab-control>

dashboard.ts里有@ViewChild（‘tabCtrl)’ tabCtrl指代tab-control这个模块，dashboard有一个变量subregion，这个变量来自于它的子组件region-panel，用@Output和时间发射器传到dashboard的。

页面初始化后mainpanel部分是没有显示的，需要根据选择的区域来显示数据。mainpanel那一块空着的地方要显示tab和tab对应的mainpanel。tab显示是根据tab-control模块的relationList，List里有几个就显示几个tab

1、用户在regionPanel点击subregion，regionpanel将收到的区域发射给dashboard（子组件到父组件）

2、dashboard用子组件的代号tabCtrl在dashboard界面调用tab-control子组件的函数（父组件传参到子组件，这里用viewChild，好像用input也可以吧）

      a、判断relationList里有没有这个subregion

  没有：先addPanel（创建这个区域的mainPanel组件），再activePanel让它显示出来，具体的就是让instance的isShow属性变为true。

    有：之间activePanel，先把所有instance的isShow改为false，再把对应的instance的改为true。

关于创建mainpanel组件，代码如下，用到resolveComponentFactory服务对象

const mainPanelFactory = this._resolver.resolveComponentFactory(MainPanelComponent);
const ref = this.mainPanel.createComponent(mainPanelFactory);
//调用resolveComponentFactory服务以mainpannelComponent类为模板创建组件

ref.instance.subregion = subregion；
//这句话非常重要，将subregion参数传入新创建的mainpanel的实例中去。所以mainpanel的subregion是这么来的。。