美文网首页Angular.js专场Angular框架交流Angular
Angular5中,父组件控制子组件显示,调用子组件方法,通知子

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

作者: 是小太阳呀 | 来源:发表于2018-06-04 01:05 被阅读19次

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

    两个tab标签

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

    解决方法:

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

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

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

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

    相关文章

      网友评论

        本文标题:Angular5中,父组件控制子组件显示,调用子组件方法,通知子

        本文链接:https://www.haomeiwen.com/subject/raossftx.html