Angular5中,父组件控制子组件显示,调用子组件方法,通知子组件刷新数据

问题:父组件中有两个tab标签,每个tab下控制各自的子组件,并且每个tab下面的数据可相互转换。


两个tab标签

如上图所示,待发布的数据和进行中的数据可相互转换。当在待发布tab中转换了一条数据为进行中时,此时切换tab为进行中并没有发现刚才转换的数据(实际上已经转换)。发现tab切换时子组件没有刷新数据,所以需要父组件主动调用子组件来刷新数据。

解决方法:

1.在父组件中声明子组件名称:#ReadyComponent,#RunningComponent

2.在父ts中获取子组件实例以调用子组件的方法



3.调用子组件方法以刷新数据


需要注意:用ViewChild装饰器获取的元素,在constructor和ngOnInit中是undefined,在AfterViewInit中可以获取到。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容