We are trying to use char.js into a ion-card, see the picture for not a working example …
The thing is, we are new on ionic and we are not sure about the components like ion-list and ion-item or ion-content, how we have to wrap the things into it … ion-item for example is not only a div … so ion-item does things we do not need …
So by the way can someone explain better how to wrap simple text or a custom component into ionic? Should we only use div’s? Or should we not use div’s in ionic2?
As you can see in the card there is a card header and 5 items into it, a item with a value “24,2” a item with a line chart, a item with a donut chart and a last item which have some text and numbers, so we do something like this
<ion-card>
<ion-card-header>
....
</ion-card-header>
<ion-card-content>
<ion-list>
<ion-list>
<ion-item style="max-height: 100px">
<component1></component1>
</ion-item>
<ion-item style="max-height: 100px">
<line-chart></line-chart>
</ion-item>
<ion-item style="max-height: 100px">
<donut></donut>
</ion-item>
<ion-item style="max-height: 100px">
<component2></component2>
</ion-item>
</ion-list>
</ion-list>
</ion-card-content>
</ion-card>
The problem is, in the ion-item there is also created an ion-label which I don’t need, and this is higher then the max-height:100px I declared in my styling.
So which are the right way to do this with ion-card and which is the right way to use ion-item or wrap custom components into ionic2 app?