As an exemple, I will use the car analogy.
Let’s say that I want a list of car models. Each element in the list is a car (have some basic attributes), but it has some very specific characteristics (specific attributes).
This can be done in many different ways:
- A big single car class which takes into account the details of each model.
- The class would be very complex, with lot of case-like structures.
- The template would also be very complex because it needs to include lots of *ngIf to show only the required attributes according to the model.
- A component for each model and a simple car class.
- All class models will be simple, because each one only take care of its own details.
- The car class also will be simple, and provide a template with an *ngIf for each car model.
- Dynamic templates selected at a car level
- A template for each car model could do the trick.
- However, AFAIK dynamic templates are not supported at this moment by Angular/Ionic.
The second approach seems much better, however it has a big flaw. As it introduces a new component inside the list level. So most Ionic component styles won’t work in the model template: ion-item, ion-item-sliding ,for instance.
So, is there a way to “remove” the extra component level without resorting to the ugly single class approach monster?
Surely many developers are displaying this kind of non-uniform object lists. What kind of solution are you guys implementing?