title: How do you use @Input with components created with a ComponentFactoryResolver?
body: <p>Is there a method that can be used to define an @Input property on an Angular 2 component that's created dynamically?</p>
  
  <p>I'm using the <a href="https://angular.io/docs/ts/latest/api/core/index/ComponentFactoryResolver-class.html" rel="noreferrer">ComponentFactoryResolver</a> to create components in a container component.  For example:</p>
  
  <pre><code>let componentFactory = this.componentFactoryResolver.resolveComponentFactory(componentName);
  
  let componentRef = entryPoint.createComponent(componentFactory);
  </code></pre>
  
  <p>Where "entryPoint" is something like this in the component HTML:</p>
  
  <pre><code>&lt;div #entryPoint&gt;&lt;/div&gt;
  </code></pre>
  
  <p>And defined in my container component with:</p>
  
  <pre><code>@ViewChild('entryPoint', { read: ViewContainerRef } entryPoint: ViewContainerRef;
  </code></pre>
  
  <p>This works well, but I can't find a way to make an @Input property work on the newly created component.  I know that you can explicitly set public properties on the component class, but this doesn't seem to work with ng-reflect.  Prior to making this change I had a "selected" property decorated with "@Input()" that caused Angular to add the following to the DOM:</p>
  
  <pre><code>&lt;my-component ng-reflected-selected="true"&gt;&lt;/my-component&gt;
  </code></pre>
  
  <p>With this in place I was able to dynamically update the markup to switch a CSS class:</p>
  
  <pre><code>&lt;div class="header" [class.active-header]="selected === true"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Based on some searching I was able to find a method to make "@Output" work as expected, but I've yet to find anything for @Input.</p>
  
  <p>Let me know if additional context would be helpful and I'd be happy to add it.</p>