Yes on this part.
Two choices here, so use whatever feels more natural to you:
- split the style bits up and bind each of them like
[style.top]="heart.top"
- build the entire style string up as a monolithic property and do
[ngStyle]="heart.style"
I think of it as a blurring of the separation of concerns. The point of using a framework like Angular in the first place is that you let it handle DOM manipulation. That means you need to get out of its way and let it do its work. The chef in a restaurant doesn’t want the food buyer in there moving the pots around.