Why is the component redrawing when moving the mouse cursor?

Question

Angular

When connecting the rating component, I accidentally noticed such a thing: when the mouse moves, the component is re-rendered.
Connection code:

<app-service-rating [serviceRating]="service.ratings"></app-service-rating>

Component code:

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-service-rating',
  templateUrl: './service-rating.component.html',
  styleUrls: ['./service-rating.component.sass']
})
export class ServiceRatingComponent implements OnInit {
  @Input() serviceRating: number;
  ratings: Array<any>;

  constructor() { }

  ngOnInit() {

    this.ratings = [];
    for(var i = 0; i < 5; i++) {
      this.ratings.push(i);
    }
  }

  getRating(index, serviceRating) {
 	 	if(index <= serviceRating) {
 	 		return 'service-rating__star service-rating__star_filled';
 	 	} else {
 	 		return 'service-rating__star';
 	 	}
 	 }

}