title: Angular get image from api with style background-image
body: <p>At this time i get an image from an API and print it to the view with interpolation:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;img src="{{url + '/get-product-image/' + product.image}}" *ngIf="product.image" class="img"/&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>My question is: It's posible to 'interpolate' from [style.background] or something like this?.
  <br/>My css:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#banner{
      background: linear-gradient(rgba(0,0,0,.8), rgba(0,0,0,.8)),
      url('https://images.unsplash.com/photo-1460306855393-0410f61241c7?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=1952&amp;q=80');
  }</code></pre>
  </div>
  </div>
  </p>
  <p>My goal is to interpolate the background-image of a html element:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;section id="banner"&gt;</code></pre>
  </div>
  </div>
  
  I've been trying this but logs errors in console:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;section [style.backgroundImage]="{{url + '/get-product-image/' + product.image}}"&gt;&lt;/section&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Thanks in advance</p>