title: It is possible to add values to an inline style using interpolation in Angular 4
body: <p>I'm learning angular 4 by myself, and I want to know if is it possible to do this:</p>
  
  <pre><code>&lt;div class="progress"&gt;
      &lt;div class="progress-bar" role="progressbar" aria-valuenow="0" aria-
  valuemin="0" aria-valuemax="100" style="width {{ item.percent_position}}%;"&gt;
  {{ item.percent_position }}&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What I want to achieve is to extend the width in relation to the value thrown by <strong>{{item.percent_position}}</strong></p>
  
  <p>When I use <strong>[style]="width: {{ item.percent_position }}%;"</strong> I got this error: <br/><em>Uncaught Error: Quotes are not supported for evaluation!
          Statement: {{item.percent_position}}%;</em> </p>
  
  <p>
  What I want is this: <a href="https://i.stack.imgur.com/99uC8.png" rel="noreferrer"><img src="https://i.stack.imgur.com/99uC8.png" alt="progress bar at 58%"></a></p>
  
  <p>
  The result I get with the code above is this:
  <a href="https://i.stack.imgur.com/8GYcB.png" rel="noreferrer"><img src="https://i.stack.imgur.com/8GYcB.png" alt=""></a></p>