Qu'est-ce que le bootstrap ngx

"ngx-bootstrap" est un framework d'interface utilisateur pour Angular. C'est le meilleur moyen pour Angular d'hériter rapidement des composants bootstrap3 ou bootstrap4, ce qui peut améliorer efficacement l'efficacité du développement. Il peut être installé à l'aide de "npm install ngx-bootstrap -- ; save ". "ngx-bootstrap".

L'environnement d'exploitation de ce tutoriel : système Windows 10, bootstrap version 5, ordinateur DELL G3

ngx Qu'est-ce que bootstrap

ngx-bootstrap est un framework d'interface utilisateur d'angular C'est le meilleur moyen pour Angular de le faire. intégrez rapidement les composants Bootstrap 3 ou Bootstrap 4. ngx-bootstrap peut améliorer l'efficacité du développement.

Ce qui est utilisé ici est @angular/cli 8.2.5, avec bootstrap4

1 Installez ngx-bootstrap

----Ouvrez la console cmd dans le répertoire du projet et entrez

----Utiliser. "--save" "Écrire les dépendances

npm install ngx-bootstrap  --save
// 也可以用国内的淘宝镜像快速安装
cnpm install ngx-bootstrap --save

2. Introduire le css correspondant dans le projet

Ajouter le chemin correspondant au style global styles dans le fichier angualr.json

 "styles": [
              "../node_modules/bootstrap/scss/bootstrap"
            ],

3. Importer les dépendances

Présentez le style CSS global Si vous souhaitez utiliser le composant correspondant, vous devez importer les dépendances pertinentes dans le module correspondant pour l'utiliser normalement

Introduisez le composant pliable et le composant onglet ici

Introduisez d'abord le composant dans la tête

import {CollapseModule, TabsModule} from 'ngx-bootstrap';

Deuxièmement, vous devez importer les importations dans la déclaration @NgModule

@NgModule({
  imports: [
    TabsModule.forRoot(),
    CollapseModule.forRoot(),
  ],
})

Ensuite, vous pouvez l'utiliser

Recommandations associées : Tutoriel bootstrap

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!