title: Difference between binding the attributes with [attr.attributeName] and [attributeName] in Angular2
body: <p>I am new to Angular2. When iam binding attributes i used to do it in following way.</p>
  
  <p>Example1:</p>
  
  <pre><code>  &lt;input type="number" [max]="variableName"&gt;
  </code></pre>
  
  <p>Example2:</p>
  
  <pre><code>&lt;select [(ngModel)]="selectedItem"&gt;
    &lt;option *ngFor="let item of itemList" [value]="item.value" [selected]="selectedItem==item.value"&gt;{{item.name}}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>Some times these bindings used to fail .</p>
  
  <p>Then i used the following syntax to bind attribute by suffixing attr. for it.</p>
  
  <p>Example1:</p>
  
  <pre><code>&lt;input type="number" [attr.max]="variableName"&gt;
  </code></pre>
  
  <p>Example2:</p>
  
  <pre><code> &lt;select [(ngModel)]="selectedItem"&gt;
        &lt;option *ngFor="let item of itemList" [value]="item.value" [attr.selected]="selectedItem==item.value"&gt;{{item.name}}&lt;/option&gt;
      &lt;/select&gt;
  </code></pre>
  
  <p>These syntax used to work like charm some times.</p>
  
  <p>Please help me in learning the difference between these two bindings <code>[attributename]</code> and <code>[attr.attributeName]</code> with there importance in using those particular syntax.</p>