2016-11-10 1 views
1

J'utilise angulaire 2 avec bootstrap. J'ai une exigence où - il y a une page de tableau de bord. Une fois que l'utilisateur clique sur n'importe quel lien sur la page du tableau de bord, le nouveau module est affiché sur la fenêtre contextuelle modale. Comment y parvenir Comme la taille de l'application est grande, je voudrais utiliser la caractéristique de chargement paresseux angulaire. Merci d'avanceAngulaire 2 module de chargement dans le popup modal

+0

Veuillez ajouter du code qui illustre ce que vous essayez d'accomplir, ce que vous avez essayé et où vous avez échoué. Que veut dire "nouveau module" dans "nouveau module"? Qu'en est-il de l'utilisation du composant de dialogue de https://github.com/ng-bootstrap/ng-bootstrap? –

+0

Je pense que vous avez besoin de plusieurs routeur-sortie, vous pouvez configurer votre itinéraire pour ce modal et les composants à l'intérieur – Akanksha

Répondre

0

Je pense que votre question a besoin de plus de détails pour une réponse correcte.

Mais d'après ce que j'ai compris, vous voulez charger un modal avec le contenu d'un autre module.

Ceci est facile à réaliser:

Composant Un tableau de bord

composant le composant B à afficher sur le tableau de bord et a le sélecteur componentB

maintenant définir votre code modal dans votre composant B, si vous besoin de données du composant A, utilisez simplement @Input() dans le composant B.

Dans le composant A, ajoutez votre sélecteur de composants dans votre fichier html et utilisez un autre élément button/link pour appeler la fenêtre modale.

Composant A HTML:

<a data-toggle="modal" data-target="#ModalWindowName">ok</a> 
<componentB></componentB> 

Le code ci-dessus déclenchera le modal dans le composant B avec le nom ModalWindowName.

Vous pouvez communiquer avec le composant B en utilisant Entrée et Sortie pour échanger des valeurs si nécessaire.