title: Angular 2 svg:circle fill attribute binding
body: <p>I am trying to bind the value of the fill attribute in an <code>&lt;svg:circle&gt;</code> element to my <code>color: string = "#cecece"</code> variable in my component. I have read many articles and tried different ways afterwards, however, noone was successful:</p>
  
  <pre><code>style="fill: {{color}}"
  
  [style]="fill: color"
  
  [style]="fill: 'color'"
  
  [attr.style]="fill: color"
  
  [attr.fill]="color"
  
  [attr.style.fill]="color"
  
  fill="{{color}}"
  </code></pre>
  
  <p>Is there some way of making this work? I am even thinking about the possibility that I have a problem somewhere else.</p>
  
  <p>The way it usually works without angular binding is:
  <code>&lt;circle fill="#cecece"&gt;&lt;/circle&gt;</code></p>