How to bind dynamically in angular2
<p>I'm building a drop-down component that allows a user of the control to configure the properties to bind to on the data-source. Here is an example of usage:</p>

<pre><code>&lt;ex-dropdown name="Office" valuemember="CODE" displaymember="DESC"     [datasource]="cities"&gt;&lt;/ex-dropdown&gt;
</code></pre>

<p>and here is an example of the data:</p>

<pre><code>var data =[
{
    "ID": 0,
    "CODE": "00",       
    "DESC": "New York"
},....
</code></pre>

<p>The data could be in a different shape so the user of the control needs the ability to set the displaymember property of the component and the component needs to bind to whatever the user sets it as. In other words the binding needs to be dynamic.</p>

<p>In my dropdown component template, I have hard coded it to bind to the DESC property:</p>

<pre><code>&lt;li *ngFor="#item of myItems"&gt;
      &lt;a href="#"&gt;  {{item.DESC}}&lt;/a&gt;
&lt;/li&gt;
</code></pre>

<p>and that works for the sample data above. But I need the binding to be dynamic.</p>

<p>I want something like <code>item[displaymember]</code>. </p>