Utilisation de Boostrap 4 avec Angular 4 alors qu'aucun composant Bootstrap (comme l'étiquette et l'en-tête) ne fonctionne

Question

Good Morning Developers.

Je travaille sur une application Angular 4 en tant que projet pour mes cours universitaires. J'ai essayé d'utiliser Bootstrap 4 et pendant que les classes CSS fonctionnent grâce à un fichier CSS importé correctement, tout ce qui nécessite jquery ne semble pas fonctionner.

J'ai essayé d'utiliser cette étiquette de bootstrap dans mes fichiers HTML.

<h3>Example heading <span class="label label-default">New</span></h3> 

Cependant, il apparaît comme une étiquette régulière mis un peu à côté grâce au fichier CSS au lieu de la fenêtre contextuelle comme le comportement de l'étiquette d'amorçage comme indiqué ici: https://getbootstrap.com/docs/3.3/components/#labels

Pour installer bootstrap J'ai utilisé les commandes npm pour installer jquery, popper et bootstrap. J'ai également lié les scripts dans le fichier angular-cli.json comme indiqué dans l'image. Jquery, Bootstrap et Popper sont installés dans les dernières versions. J'ai essayé d'utiliser les versions min des fichiers de script, cela n'a pas aidé. Je ne peux pas trouver la raison par moi-même, s'il vous plaît partager vos idées.

Answer 1

Avez-vous importé le bootstrap, popper et jquery installés dans le fichier angular-cli.json?

importer Veuillez celles ordre suivant:

1. jquery
2. Popper
3. Bootstrap