Angular2: how to parse JSON in background: url?

Question

css

The task is as follows: there is a list of products generated by *ngFor.
Each product has an {{product.image}}
image. I get this image from a JSON file:

[
{
  "title": "Product 1",
  "price": "3000",
  "image": "https://abcdefg/hij/klm.jpeg"
},
{
  "title": "Product 2",
  "price": "200",
  "image": "https://bbbbnnnnn/ggghhh/kjk.jpeg"
}
]

<ul>
  <li *ngFor="let product of products">
   <span class="product__image">
        {{product.image}}
  </span>
    <span class="product__title">
       {{product.title}}
    <span>
    <span class="product__price">
      {{product.price}}
   <span>
  </li>
</ul>

The problem is that the images are not brought to a single view. In order to more or less correctly display them in the render on the page, the option background-size: cover;for the corresponding block would suit me.
It would be possible to insert an image through a tag imgand write styles for it in CSS, but imgbackground-size: cover;it will not be possible to write for it.
How would it be correct to solve such a problem?