Pass a variable from child to parent component

Question

So I am trying to get a value from my child component to print in my parent component and I tried the following:

In my child component ts:

export class ChildComponent {
message: string = 'Hello!!!';
}

In my parent component ts:

import { Component, ViewChild, AfterViewInit} from '@angular/core';
import { ChildComponent } from '../child/child.component'

export class ShoppingCartComponent implements ControlValueAccessor, AfterViewInit {
messageFromChild : string;
@ViewChild(ChildComponent) myChild;
ngAfterViewInit() {
this.messageFromChild = this.myChild.message;
}
}

In my parent component html:

<h1> From Child - {{ messageFromChild }} </h1>

I don't get any errors but {{ messageFromChild }} is blank.