title: Dynamic values for @Input in Directive from Component (Angular 4, 5, 6)
body: <p>Input defined in Directive:</p>
  
  <p><code>@Input items: any[];</code></p>
  
  <p>Data defined in Component:</p>
  
  <p><code>data: string[] = ['Item 1', Item 2', 'Item 3'];</code></p>
  
  <p>Directive used in component template:</p>
  
  <p><code>&lt;input type="text" myDirective [items]="data"&gt;</code></p>
  
  <p><strong>How can we update values of <code>items</code> in Directive whenever <code>data</code> array is changed in Component?</strong></p>
  
  <p>For example, if the <code>data</code> in Component updated to:</p>
  
  <p><code>data: string[] = ['Item 1', Item 2', 'Item 3', 'Item 4'];</code></p>
  
  <p>The <code>'Item 4'</code> must be accessible inside Directive.</p>