How to check the validity of the child component form within the parent component in Angular 4

Question

I have a scenario where I am accessing two different NgForm one within Parent form #parentform and other in the Child component #childForm, and i want to check the validity of the controls of child form wether valid or not in parent component form. How to do this in angular4.

I also followed this link: Check if a form is valid from a parent component using Angular 4

everytime i am getting undefined for the reference of child component form.

My code is something like this.

parent.component.html

    <form class="form-wrapper" (ngSubmit)="parentForm.form.valid && save()" #parentForm="ngForm" novalidate>
        <input id="firstName" type="text" placeholder="" class="validate" name="firstName" [(ngModel)]="firstname_" #firstName="ngModel" required>                        
    </form>
    <child-component></child-component>

child.component.html

 <form class="form-wrapper" (ngSubmit)="childForm.form.valid && save()" #childForm="ngForm" novalidate>
        <input id="phoneNumber" type="text" placeholder="" class="validate" name="phoneNumber" [(ngModel)]="phone_" #phoneNumber="ngModel" required>                        
 </form>

Now i want to validate the child component form "childForm" valid or not in parent form

Please follow the link... stackblitz.com/edit/angular-cjorjz. Now i want to disable the save button until both the form controls are invalid only after the valid of both the forms i want to enable the button — punitmirani30
How to access the NgForm using reference variable ?? Something like parentForm.form.valid and childForm.form.valid ?? — punitmirani30