title: <ng-template> show in other component
body: <p>I have 2 components.</p>
  
  <p>The <code>.html</code> of parent component this is the code:</p>
  
  <pre><code>&lt;div class="space"&gt;
      &lt;ng-container *ngFor="let item of items"&gt;
          &lt;ng-container [ngTemplateOutlet]="itemTemplate" [ngTemplateOutletContext]="{item: item}"&gt;
          &lt;/ng-container&gt;
      &lt;/ng-container&gt;
  &lt;/div&gt;
  
      &lt;ng-template #itemTemplate let-item="item"&gt;
          &lt;div class="host"&gt;
              &lt;img class='card-img-top'
                  src={{item.image}}
                  &gt;
              &lt;p&gt;&amp;nbsp;&lt;/p&gt;
              &lt;h6 class="title"&gt;{{item.projectTitle}}&lt;/h6&gt;
              &lt;hr&gt;
  
              &lt;ng-container *ngIf="item.type=='inactive'"&gt;
                  &lt;button id="inactive"
                      class="btn btn-sm btn-warning py-0 custom-button text-uppercase"&gt;{{item.type}}&lt;/button&gt;
              &lt;/ng-container&gt;
          &lt;/div&gt;
      &lt;/ng-template&gt;
  </code></pre>
  
  <p>All code since line: <code>&lt;ng-template #itemTemplate let-item="item"&gt;</code></p>
  
  <p>It's necessary to show in the <code>.html</code> of the child component.</p>
  
  <p>This is the .<code>ts</code> of parent component</p>
  
  <pre><code>import { AfterViewInit, Component, ComponentFactoryResolver, ViewChild, ViewContainerRef, OnInit, TemplateRef, Input, ContentChild } from '@angular/core';
  import listProjects from './projects.json';
  import { ChildComponent } from './child.component';
  
  @Component({
    selector: 'parent-view',
    templateUrl: './parent.component.html',
    styleUrls: ['./parent.component.scss'],
  })
  export class ParentComponent {
    public items: any = listProjects;
    @ContentChild('itemTemplate', { read: TemplateRef }) itemTemplate: ViewContainerRef;
  </code></pre>
  
  <p>How can show the <code>&lt;ng-template #itemTemplate let-item="item"&gt;</code> in other component? </p>