title: Using Ember.js text field ids for a <label> tag
body: <p>A label tag is of the form:</p>
  
  <pre><code>&lt;label for="id_of_text_field"&gt;
  &lt;input type="text" name="example" id="id_of_text_field" /&gt;
  </code></pre>
  
  <p>Where the <code>for</code> tag of the label and the <code>id</code> tag of the text field need to match.  I had two ideas to make this work in my Ember.js template:</p>
  
  <p><strong>Idea #1:</strong> I tried to make a special binding named <code>field_id</code> to use in both the <code>label</code> and the <code>TextField</code>. I executed this as follows:</p>
  
  <pre><code>&lt;label {{bindAttr for="content.field_id"}}&gt; {{content.label}}&lt;/label&gt;
  {{view Ember.TextField valueBinding="content.data" id="content.field_id"}}
  </code></pre>
  
  <p>Unfortunately only the <code>label's</code> id renders correctly. The <code>TextField's</code> id does <strong>not</strong> render correctly and turns out to be "metemorph... something-or-other".</p>
  
  <p><strong>Idea #2:</strong> To somehow conjure the TextField's id and use that for the label tag, but I'm afraid at some point the TextField's id will not be ready when the label tag is rendered.  Even if this were not an issue, I do not know how to find the <code>TextField's</code> id from JS.</p>
  
  <p>This is in a template so I will have more than one of these label/TextField pairs.</p>
  
  <p>How can I get the label's <code>for</code> tag to match up with the TextField's <code>id</code> tag with Ember.js?</p>
  
  <p>Thank you!</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>Using Peter Wagenet's advice and slight modification, I did the following:</p>
  
  <pre><code>&lt;label {{bindAttr for="textField.elementId"}}&gt; {{content.label}}&lt;/label&gt;
  {{view Ember.TextField valueBinding="content.value" viewName="textField"}}
  </code></pre>
  
  <p>Using this technique users can now click labels to select TextFields, CheckBoxes, and Selects.</p>