Add directive to component generated dynamically

Question

I was searching, how create a component dinamicamente y followed the steps the Equivalent of $compile in Angular 2 and running perfect

import {Component, Input} from '@angular/core';
import {Observable}       from "rxjs/Rx";
@Component({
selector: 'string-editor',
template: `
<dl>
  <dt>{{propertyName}}</dt>
  <dd>
    <input
      type="text"  
      [(ngModel)]="entity[propertyName]"  />
  </dd>
</dl>`,
})
export class StringEditor {

@Input()  public propertyName: string;
@Input()  public entity: any;
};

I have a directive called :

import { Directive, ElementRef, Input } from '@angular/core';
declare var $:any;
@Directive({ selector: '[myHighlight]' })
export class HighlightDirective {
constructor(el: ElementRef) {
    el.nativeElement.style.backgroundColor = 'yellow';
}
}

now I like make this in my compoment what still not exists, add the Directive declared above and when will generate this component too what have the Directive, but no working, this component is created with compiler, etc

@Component({
selector: 'string-editor',
template: `
<dl myHighlight>
  <dt>{{propertyName}}</dt>
  <dd>
    <input
      type="text"  
      [(ngModel)]="entity[propertyName]"  />
  </dd>
</dl>`,
})

how make for what when generate a component too will have the property a directive