title: Angular 8 ngStyle sometimes does not work inside a loop
body: <p>I have the following code in Angular 8.</p>
  
  <pre><code>&lt;mat-grid-list cols="5" rowHeight="16:9" gutterSize="1%"&gt;
      &lt;mat-grid-tile *ngFor="let m of media; index as i"&gt;
          &lt;div class="media-cards" [ngStyle]="{'background-image': 'url(' + m.thumbnail + ')'}"&gt;&lt;/div&gt;
      &lt;/mat-grid-tile&gt;
  &lt;/mat-grid-list&gt;
  </code></pre>
  
  <p>For some strange and unknown reason, it does not add <code>background-image</code> style in some of the elements generated in the loop. <code>m.thumbnail</code> is a valid URL and available for each element of the <code>media</code> object.</p>
  
  <p>This is how it looks (background image missing):
  <a href="https://i.stack.imgur.com/uUY58.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uUY58.png" alt="Out put"></a></p>
  
  <p>This is how the generated code looks like:
  <a href="https://i.stack.imgur.com/kTmGx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kTmGx.png" alt="Geneated code"></a></p>
  
  <p>You can see in the image above that <code>background-image</code> style is missing for the second element. </p>
  
  <p>Why is it happening like this? Where is the problem?</p>