Ionique 2 - Tables
J'aimerais créer des tableaux à l'aide ionique comme dans le Bootstrap.
J'aimerais que mes tables pour ressembler à CE LIEN d'exemples.
Donc, la fonction que je ne pouvais pas trouver dans Ionique de Docs était "en-têtes de tableau". Tous les exemples que je suis la recherche ne considèrent pas les en-têtes du tableau.
Aussi, est-il un moyen natif Ionique pour faire les lignes de la table de couleur comme Bootstrap "Contextuel de la Disposition de Table" et réactif, comme"
Réactif Tableau de Mise en page" exemples dans ce lien?
OriginalL'auteur Aleksandrus | 2016-08-31
Vous devez vous connecter pour publier un commentaire.
Vous pouvez faire votre
ionGrid
ressembler à celle qui a un lien avec quelques règles de style. Comme vous le dites, les docs ne dis rien sur les en-têtes, mais vous pouvez utiliser le<strong></strong>
élément html:Et je pense qu'il n'y a pas un natif de façon pour faire les lignes de la table de couleur comme Bootstrap "Contextuel de la Disposition de Table", mais vous pouvez le faire avec juste quelques règles de style:
Et sur la Sensible Disposition de Table, même si on pouvait atteindre qu'en jouant avec la débordement propriété CSS, je ne pense pas que ce soit une bonne idée car il peut affecter d'autres choses comme la sole de glissement pour effet d'ouvrir le menu de gauche, ou des choses comme ça. Si la largeur de la table est trop grande pour la taille de l'écran, au lieu de faire défilant, une meilleure solution serait juste pour afficher une colonne ou deux avec les données les plus importantes, et d'inclure un bouton qui vous amène à une page de détails de l'endroit où vous pouvez voir le reste de cette information.
Mise à JOUR
De Ionique 3.0.0, le Grille de composant a été mis à jour, et beaucoup de nouvelles fonctionnalités ont été inclus. Vous pouvez prendre un coup d'oeil à ce travail plunker de voir certaines des nouvelles fonctionnalités de la nouvelle grille du composant.
white-space: pre-line
sur<ion-col>
éléments.À l'aide de google chrome dev tools, j'ai vu qu'un défilement de la grille n'ont pas d'incidence sur le menu de gauche. Mais comme nous avons affaire avec le html et le css, je ne peux pas être sûr si cela va fonctionner sur tous les appareils et/ou des applications. Donc pour l'instant je dirais que "oui, l'utiliser à défilement
Plaisir à entendre 🙂 Le
white-space: pre-line
sur<ion-col>
éléments est une excellente solution pour ce problème!Que plunker n'existe plus.
Je pense que le plus gros problème ici est que cela ne va pas se comporter comme un tableau, les colonnes toujours la même taille sur des lignes différentes. Il fonctionne si le contenu peut envelopper, mais sinon la mise en page est complètement cassé
OriginalL'auteur sebaferreras