0
votes

Angulaire 7 onglets dans le composant

Besoin de créer un composant ayant indiqué - 2 onglets En cliquant sur chaque onglet, il faut rediriger vers un composant spécifique.

pour ex-dire que j'ai deux onglets sur une seule page - onglet 1, onglet 2 En cliquant sur l'onglet 1 besoin de voir composant_1 En cliquant sur l'onglet 2, besoin de voir Composant_2

Pour être clair ui quelque chose comme- https://material.angular.io/components/ Tabs / API

mais n'importe quel moyen sans utiliser des onglets de matériau angulaire


2 commentaires

Si j'ai bien compris votre question, veuillez trouver le lien Stackblitz.com/angular/lklycoqrgao ou autre s'il vous plaît élaborer ta question ?


@RAHULLAD - Je voulais quelque chose comme - matériau.angular.io/components/tabs/api


4 Réponses :


0
votes

Vous pouvez créer un composant d'en-tête pour cela et le définir sur le composant App et la navigation sur le routeur de démarrage et donner un routage peut vous aider à sortir


0 commentaires

0
votes

Vous devez charger le composant_1 et le composant_2 de manière dynamique. Un moyen dynamique, que l'emplacement des composants de l'application n'est pas défini à la limite de la construction. Cela signifie que cela n'est utilisé dans aucun modèle angulaire. Au lieu de cela, le composant est instancié et placé dans l'application au moment de l'exécution. Voir ici Comment créer de manière dynamique des composants dans Angular7


0 commentaires

2
votes

Vous pouvez utiliser NGX-BOOTSTRAP pour cela.

Module.ts xxx

fichier.html xxx


1 commentaires

Je le marquis comme réponse depuis que cela a fonctionné pour moi .. En plus de cela, comment puis-je faire l'impact que l'onglet est sélectionné lorsqu'un onglet est sélectionné.



3
votes

Maintenir une variable de tableau 'onglets' avec la propriété 'Type' pour chaque objet. par exemple: onglets: tout [] = [{nom: onglet1 ', tapez:' tab1 '}, {Nom:' Tab2 ', type:' Tab2 '}]; Basé sur la propriété 'Type', chargez / commutation du composant de l'onglet Particulier en HTML. Par exemple: xxx


0 commentaires