Angular ngOnChanges на несколько элементов одного компонента

У меня имеется компонент Rating для карточек товара. Таких карточек может быть более одной на странице. Подскажите, пожалуйста, почему у меня все изменения на рейтинге в карточках применяются именно к рейтингу из первой карточки? Что нужно исправить/дописать? Заранее спасибо)

template: `
        <div class="card__rating">
      <input type="radio" id="rate5" name="rating" value="5" readonly [attr.checked]="isChecked(5)">
      <label for="rate5" title="Оценка «5»"></label>
      <input type="radio" id="rate4" name="rating" value="4" readonly [attr.checked]="isChecked(4)">
      <label for="rate4" title="Оценка «4»"></label>
      <input type="radio" id="rate3" name="rating" value="3" readonly [attr.checked]="isChecked(3)">
      <label for="rate3" title="Оценка «3»"></label>
      <input type="radio" id="rate2" name="rating" value="2" readonly [attr.checked]="isChecked(2)">
      <label for="rate2" title="Оценка «2»"></label>
      <input type="radio" id="rate1" name="rating" value="1" readonly [attr.checked]="isChecked(1)">
      <label for="rate1" title="Оценка «1»"></label>
</div>
  `, 

export class RatingComponent implements OnInit, OnChanges {
  @Input() rating: number | undefined;
  @Input() reviews: number;
  constructor() { }

  innerRating: number | undefined;
  innerReviews: number;

  ngOnInit(): void {
  }

  ngOnChanges(changes: SimpleChanges): void {
    const { rating, reviews } = changes;

    if (rating && rating.currentValue) {
      this.innerRating = rating.currentValue

    }

    if (reviews && reviews.currentValue) {
      this.innerReviews = reviews.currentValue
    }
  }

  isChecked(value: number) {
    return this.rating === value ? '' : null
  }

}