title: Spread attributes for an element in Angular >=6 template
body: <p>I have this in my code...</p>
  
  <pre><code>@Component({
    selector: 'generic-input',
    template: `&lt;div&gt;&lt;input [formControl]="control"/&gt;&lt;/div&gt;`,
  })
  export class GenericInputComponent implements OnInit {
  
    @Input('config') config = {placeholder: 'Testability', disabled: true, type: 'text'};
  
    control;
  
    constructor() { }
  
    ngOnInit() {
      this.control = new FormControl();
    }
  
  }
  </code></pre>
  
  <p>I would like to spread the attributes in the config object by using some sort of a loop or something else so that the rendered html 
  is as follows:</p>
  
  <pre><code>&lt;div&gt;&lt;input placeholder='Testability', disabled=true type='text' [formControl]="control"/&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>Note:</strong>
  This following is not an option:</p>
  
  <pre><code>   &lt;div&gt;&lt;input [placeholder]='config.placeholder', [disabled]='config.disabled' [formControl]="control"/&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Any help and ideas are welcome. Thank you.</p>