title: Override/extend third-party component's template
body: <p>I am currently importing a third party component. For my use case I need to override that specific component template. </p>
  
  <p>Since this is a third party component, and imported via npm package, I don't want to change the component so I don't have to update it everytime the package is updated. </p>
  
  <p>Is there any way to overwrite the template of another component? </p>
  
  <p>I know you can use <code>&lt;ng-content&gt;</code> if you want to inject some element. But here is not viable. </p>
  
  <p>The html is something like this:</p>
  
  <pre><code>&lt;third-party-component [items]="items" [example]="example"&gt;
  </code></pre>
  
  <p>The controller is something like this: </p>
  
  <pre><code>import {THIRD_PARTY_DIRECTIVES} from 'ng2-select/ng2-select';
  
  @Component({
    selector: 'example-component',
    directives: [THIRD_PARTY_DIRECTIVES]
  })
  export class Example {
  
    private items: Array&lt;string&gt; = [
      'whatever', 'whatever2', 'whatever3'
    ];
  }
  </code></pre>
  
  <p>Is there any way I can specify the template I want for <code>&lt;third-party-component&gt;</code> without editing that specific component declaration? Or even extend it only ?</p>