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?