I've read the guide on Dynamic Component Loading, however I'm not quite sure it exactly solves what I would like.
I have the concept of different 'brands' let's say, and based on a 'brand' variable, would like to load a different UI for a number of components. Now based on the above link, I could create a brand specific Component for each brand, and then have something which does:
if (brand == A) {
return Component1BrandA
} else if(brand == B) {
return Component1BrandB
}
...
The problem with this is that it would be super verbose, and I want to keep any 'brand' specific if/else mentions out of the code. This is so that as new 'brands' are added, I can just add templates/Components somewhere based on a 'brand' directory or something and they just get automatically picked up.
e.g. I would prefer something like:
return "Component1Brand${brand}"
What are my options here? Is it possible to dynamically set the Component name to get using a variable?
Or if there is no avoiding 'brand' specific if/else stuff, would I be better off adding different sections within existing component templates and just showing and hiding them based on the 'brand'?
<div *ngIf="isBrandA"></div>
<div *ngIf="isBrandB"></div>