ioinc页面加载前绑定_ionic3关于页面返回时刷新segment中的子组件数据的方法

思路：

1、ionic3中已知存在页面的生命周期函数，也可以找到ionic3中组件的相关生命周期函数。

2、父子组件通信的方法

资料收集：

1、angular2中组件的相关周期函数如下：

ngOnChanges：在ngOnInit之前，当数据绑定输入属性的值发生变化时。

ngOnInit：在第一次ngOnChanges之后。

ngDoCheck：每次Angular变化检测时。

ngAfterContentInit：在外部内容放到组件内之后。

ngAfterContentChecked：在放到组件内的外部内容每次检查之后。

ngAfterViewInit：在初始化组件视图和子视图之后。

ngAfterViewChecked：在子组件视图和子视图检查之后。

ngOnDestroy：在Angular销毁组件/指令之前。

备注：(ngOnChanges与ngDoCheck存在互斥，尽量不要同时出现)

2、Ionic2中NavController模块的生命周期如下：

无返回值事件：

ionViewDidLoad：当页面加载完毕时触发。它只会在新页面被创建时触发一次，如页面被缓存再一次触发，它不会有任何反应。

ionViewWillEnter：当页面即将加载时会触发。

ionViewDidEnter：它的触发和ionViewDidLoad的区别在于，不管是第一次加载还是缓存加载它都会触发

ionViewWillLeave：当前页面即将离场时触发。

ionViewDidLeave：当前页面完全离场时触发。

ionViewWillUnload：当前页面即销毁时触发。

有返回值事件：

ionViewCanEnter：在一个需要授权的页面进入之前，它会触发。用于检查当前用户的资格。

ionViewCanLeave：在一个需要授权的页面离开之前，它会触发。用于检查当前用户的资格。

3、把子组件的数据绑定函数

因为需要经常调用子组件的数据绑定函数，所以将数据绑定函数写在ngOnInit()中。

ngOnInit(){

// 数据绑定函数

this.getCourses();

}

4、angular2中父子组件的通信方式：

在父组件ts页面中引入ViewChild，并在父类中进行声明子组件变量，并在父组件的ionViewWillEnter()中使用变量调用子组件中的函数。

import { ViewChild } from '@angular/core';

export class TeachMainPage {

@ViewChild(Courseware) child_courseware:any;

...

ionViewWillEnter(){

this.child_courseware.ngOnInit();

}

}

完成：

页面加载时，父组件会调用ionViewWillEnter()对子组件进行加载。

返回到页面时，也会触发ionViewWillEnter()函数，同时也通过调用触发子组件的ngOnInit函数，从而完成数据刷新。