I have a my-gallery component containing my-image as sub-components, that represent images.
Basically, I have something like :
my-app.component.htm:
<gallery [imageList]="myImages"></gallery>
my-gallery.component.htm:
<my-image *ngFor="let image of imageList" [image]="image">
</my-image>
So far so good. Now I'd like to instantiate the my-gallery component twice, each time using a different sub-component (to get different image representations). But my-image is hard-coded in my-gallery.component.htm.
Let's say I'd like to sometimes use my-image1, and other times my-image2. I would expect to be able to write something like :
<gallery [imageList]="myImages1" subComponent="my-image1"></gallery>
<gallery [imageList]="myImages2" subComponent="my-image2"></gallery>
What is the best way to achieve this?
I'm not sure I can use content projection because I'm using 'ngFor' for each image...
Maybe I could pass a component name as an input of my-gallery, to instantiate my-image1 or my-image2 manually? But then my-images would need to be databound programmatically (if possible), I'm not sure it's the best way...
For sure, I'll create a base class for my-image1 and my-image2.