title: Pass a text from one component to another component in Angular
body: <p>Below is my <code>landing-HTML</code> page</p>
  
  <pre><code>&lt;div class="container"&gt;
  
    &lt;div&gt;
      &lt;mat-radio-group class="selected-type" [(ngModel)]="selectedType" (change)="radioChange()"&gt;
        &lt;p class="question"&gt;Which movie report would you like to see ?&lt;/p&gt;
        &lt;mat-radio-button id="movie-a" class="Movie-type" [value]="MovieType.HORROR"&gt;Horror&lt;/mat-radio-button&gt;
        &lt;mat-radio-button id="movie-b" class="Movie-type" [value]="MovieType.ROMANTIC"&gt;Romantic&lt;/mat-radio-button&gt;
  
      &lt;/mat-radio-group&gt;
    &lt;/div&gt;
  
      &lt;movie-report *ngIf="showMovieReport"&gt;&lt;/movie-report&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>This <code>&lt;movie-report&gt;</code> is a different component and has its own <code>component.ts</code> which makes <code>REST Call</code> and give some data. </p>
  
  <p>I wanted to pass the <code>MovieType</code> data to <code>MovieReport</code> component. How to do it ?</p>