Angular 2 - how do I data bind an SVG attribute to a component property?
<p>I'm learning Angular 2. For that, I'm trynig to create basic example.</p>

<p>I have a class with a variable that contains this string: <code>M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z</code></p>

<p>I'm trying to use that string as a parameter for a svg element</p>

<p>Just to check:</p>

<p>This svg works:</p>

<pre><code>&lt;svg fill="white" height="64" width="64"&gt;
    &lt;path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z"/&gt;
&lt;/svg&gt;
</code></pre>

<p>The variable <code>icon</code> in the template contains the correct string. I'm trying to do like this:</p>

<pre><code>&lt;svg fill="black" height="24" width="24"&gt;
  &lt;path d={ icon } /&gt;
&lt;/svg&gt;
</code></pre>

<p>And Adding <code>"</code> to the parameter <code>d</code>. But I cannot make it work</p>