title: Angular 8 issue with directive on component html
body: <p>I have created a directive using angular 8.</p>
  
  <p>Directive code:</p>
  
  <pre><code>import { Directive, ViewContainerRef } from '@angular/core';
  
  @Directive({
    selector: '[appDynamic]',
    exportAs: 'dynamicdirective'
  })
  export class DynamicDirective {
  
    constructor(public viewContainerRef: ViewContainerRef) { }
  
  }
  </code></pre>
  
  <p>Then I added it to my component ts file:</p>
  
  <pre><code>import { Component, OnInit, ComponentFactoryResolver, ViewChild } from '@angular/core';
  
  @Component({
    selector: 'app-preview',
    templateUrl: './preview.component.html',
    styleUrls: ['./preview.component.scss']
  })
  export class PreviewComponent implements OnInit {
  
    @ViewChild('sider', {static: true})
    sider;
  
    constructor(private componentFactoryResolver: ComponentFactoryResolver) {
    }
  
    ngOnInit() {
      const componentFactory = this.componentFactoryResolver.resolveComponentFactory(PreviewComponent);
      this.sider.viewContainerRef.createComponent(componentFactory);
    }
  
  }
  </code></pre>
  
  <p>And finally I added the code to the component's html which is where I'm getting the error:</p>
  
  <pre><code>&lt;ng-template #sider="dynamicdirective" dynamic&gt;&lt;/ng-template&gt;
  </code></pre>
  
  <p>The line of code above is giving me the following error:</p>
  
  <pre><code>There is no directive with "exportAs" set to "dynamicdirective"
  </code></pre>
  
  <p>How can I fix this?</p>