How to communicate from parent component to the child component in Angular 9 ?

<child [id] = "parentid"></child>

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

@Component({
  selector: 'app-root',

// code for parent component view.

  template:`
  <div style="text-align: center;">
  <h1>
    parent component - {{parentid}}
  </h1>
  </div>

// Bind the ParentId to child component.

  <child [id] = "parentid"></child>
  `,
  styleUrls: []
})
export class AppComponent {

// This property is to be sent to the child component.

parentid: number = 1;

}

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

@Component({
  selector: 'child',
  template: `
  <div style="text-align: center;">
  <h2>child component</h2>

// property successfully received from the parent component.

  parent id is {{id}}
  </div>
  `,
  styles: []
})
export class TestComponent implements OnInit {

// @input decorator used to fetch the 
// property from the parent component.

  @Input()
  id: number;
  
  ngOnInit(): void {
  }

}