Как я могу изменить свойство класса .css - background: url ('') для каждого элемента javascript / typescript

Вот как я отображаю продукты из базы данных:

<div *ngFor = "let product of products;">
  <div id = "article1" class = "article">
    <p class = "product-price">{{product.mpc | number}}</p>
    <p class = "product-title">{{product.title}}</p>
  </div>
</div>

Как видите, есть класс .css "article" с id = "article1" ..

А вот и статья класса .css:

.article {
  background-color: black;
  cursor: pointer;
  background: url('../../src/assets/images/funny-photo.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center, center;
}

Как можно увидеть фон: url этого класса .article жестко запрограммирован:

background: url('../../src/assets/images/funny-photo.jpg');

Как я могу установить для каждого элемента разные background: url с соответствующим URL из базы данных?

Спасибо, парни Ваше здоровье