Auto refresh a child component after submit in the same page

Ionic Framework ionic-v3
#1

I would like to know if you could to tell how to refresh a child component after submit in the same page…???

This is my code:

comment page HTML:

<!--
  Generated template for the CommentPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>Comments</ion-title>
  </ion-navbar>

</ion-header>


<ion-content no-padding>
   <app-commentview  [(comment)]="commentDatas"></app-commentview>

</ion-content>

<ion-footer>
<ion-toolbar>
  <ion-grid>
    <form [formGroup]="commentForm" (ngSubmit)="saveComment()">
    <ion-row>
      <ion-col col-9>
          <ion-textarea name="commenttxt" formControlName="commenttxt" placeholder="comment here..."></ion-textarea>
      </ion-col>
      <ion-col col-3>
          <button ion-button clear type="submit">Submit</button>
      </ion-col>
    </ion-row>
    </form>
  </ion-grid>
</ion-toolbar>
</ion-footer>

Comment page TS:


import { Component, OnInit } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

//import { Comments } from "../../models/comments/comments.interface";
import "rxjs/add/operator/map";
import { Http, Headers } from '@angular/http';
import { FormBuilder, Validators } from '@angular/forms';


@IonicPage()
@Component({
  selector: 'page-comment-page',
  templateUrl: 'comment-page.html',
})
export class CommentPage  implements OnInit {
  comments: string;

   commentForm:any;
   postID;
   commentDatas=[];

  constructor( private http: Http, private navCtrl: NavController, private navParams: NavParams, public _form: FormBuilder) {

}

ngOnInit() {
  this.commentForm = this._form.group({
     "commenttxt":[""]
   });  

//this.comments = "exemplestring";


   this.postID = this.navParams.get('idcomment');


let headers = new Headers();

    this.http.get('http://localhost:9000/hsc/api/comments?post_id='+ this.postID, {headers: headers, withCredentials: true})
  .map(res => res.json())
  .subscribe(data => {
        console.log(data);
       this.commentDatas = data.results;
      });

}
  saveComment(){

    let headers = new Headers();
  
    let postmsg = {
      "text": this.commentForm.value.commenttxt, 
      "post_id": this.postID
    };
    
  this.http.post('http://localhost:9000/hsc/api/comments', postmsg ,{headers: headers, withCredentials: true})
    .subscribe(data => {
        console.log("COMMENT ADDED", postmsg);
      }, error => {
        console.log(error);// Error getting the data
      });
        
  this.commentForm.reset();

  }
}

commentview-component HTML:


<div *ngFor="let c of commentData">
<ion-card>
   <ion-row>
    <ion-col align-self-center>
     <ion-item class="clh6">
    <ion-avatar item-left>
      <img src="assets/images/avatar.png">
    </ion-avatar>
    <h6 >{{c.first_name}} {{c.last_name}}</h6>
   </ion-item>
    </ion-col>
       <ion-col text-right align-self-center padding-right>
        <ion-note>{{ c.date_added | amTimeAgo }}</ion-note>
      </ion-col>
    </ion-row>
    <ion-row class="commsg">
        
{{c.text}}
</ion-row>
</ion-card>
</div>

commentview-component TS:

import { Component, Input } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';



/**
 * Generated class for the Commentview component.
 *
 * See https://angular.io/docs/ts/latest/api/core/index/ComponentMetadata-class.html
 * for more info on Angular Components.
 */
@Component({
  selector: 'app-commentview',
  templateUrl: 'commentview.component.html'
})

export class CommentviewComponent {
@Input("comment") _comment;

   commentData=[];

  constructor( private navCtrl: NavController, private navParams: NavParams) {
  }

ngAfterViewInit() {
     this.commentData= this._comment;

     console.log("COMMENTVIEW:", this.commentData);

}

}

thanks in advance ad your help will be aprreciated!

Regard,
Marwan