Angular - Call child component method from parent

app.component.html

<button (click)="callChild()"> Call child </button>
<button (click)="childcomp.sayHello()"> Call child from view</button>
<app-comp-a #childcomp ></app-comp-a>

app.component.ts

import { Component, OnInit, ViewChild } from '@angular/core';
import { CompAComponent } from './components/comp-a/comp-a.component';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {

  title = 'angular-learning';

  @ViewChild(CompAComponent) childcomp: CompAComponent;

  ngOnInit(): void { }

  callChild() {
    this.childcomp.sayHello()
  }

}

comp-a.component.ts

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-comp-a',
  templateUrl: './comp-a.component.html',
  styleUrls: ['./comp-a.component.scss']
})
export class CompAComponent implements OnInit {

  constructor() { }

  ngOnInit() { }

  sayHello(){
    alert("Hello from comp-a");
  }

}