title: What is a better way to pass down a template to the component? As props or contents?
body: <p>Sometimes, we feel like passing down a piece of template to a component to make it reusable or customizable. We can achieve it either by passing template reference like:</p>
  
  <pre><code>// In a parent component
  &lt;ng-template #templateEx&gt;&lt;p&gt;I'm an example1&lt;/p&gt;&lt;/ng-template&gt;
  &lt;theme-comp [template]="templateEx"&gt;&lt;/theme-comp&gt;
  
  // In a child(ThemeComponent) component
  ...
  @Input() template: TemplateRef&lt;any&gt; // use it with ng-container
  </code></pre>
  
  <p>Or by projecting the template we want like:</p>
  
  <pre><code>// In a parent component
  &lt;theme-comp&gt;
    &lt;ng-template&gt;&lt;p&gt;I'm an example2&lt;/p&gt;&lt;/ng-template&gt;
  &lt;/theme-comp&gt;
  
  // In a child component
  ...
  @ContentChild(TemplateRef) template: TemplateRef&lt;any&gt; // use it with ng-container
  </code></pre>
  
  <p>I think the both approaches would work perfectly fine but I'm just curious about the proper use cases for each one, or just differences. Any insight would be appreciated!</p>