title: Angular 2, input attribute is removed from DOM
body: <p>I've got a button that I can enable/disable via a binding:</p>
  
  <pre><code>&lt;button [disabled]="model.disabled"&gt;Do Something&lt;/button&gt;
  </code></pre>
  
  <p>I've got some styling that's dependent on that attribute, for example:</p>
  
  <pre><code>button[disabled] {
    background: red;
  }
  </code></pre>
  
  <p>So far so good.</p>
  
  <p>Now I attach a directive to that button which uses the disabled attribute an input:</p>
  
  <pre><code>@Directive({
    selector: "[some-directive]"
  })
  class SomeDirective {
    @Input("disabled") disabled: boolean;
  }
  </code></pre>
  
  <p>If I attach this directive to a node:</p>
  
  <pre><code>&lt;button some-directive [disabled]="model.disabled"&gt;Do Something&lt;/button&gt;
  </code></pre>
  
  <p>This strips the <code>disabled</code> attribute from the DOM, which breaks my styling.</p>
  
  <p>Why is it doing this? Can I <em>stop</em> it from doing this?</p>
  
  <p><a href="https://plnkr.co/edit/ShyxaDgoRnkitJq6RoCe?p=preview" rel="nofollow noreferrer">Plunker demonstrating this problem.</a></p>