Was ist NGX-Bootstrap?

WBOY
Freigeben: 2022-08-01 18:07:34
Original
2884 Leute haben es durchsucht

„ngx-bootstrap“ ist ein UI-Framework für Angular. Es ist die beste Möglichkeit für Angular, Bootstrap3- oder Bootstrap4-Komponenten schnell zu erben, was die Entwicklungseffizienz effektiv verbessern kann; save“-Befehl. „ngx-bootstrap“.

Was ist NGX-Bootstrap?

Die Betriebsumgebung dieses Tutorials: Windows 10-System, Bootstrap-Version 5, DELL G3-Computer

ngx Was ist Bootstrap

ngx-bootstrap ist ein UI-Framework von Angular. Es ist die beste Möglichkeit für Angular Schnelle Integration von Bootstrap 3- oder Bootstrap 4-Komponenten. ngx-bootstrap kann die Entwicklungseffizienz verbessern.

Was hier verwendet wird, ist @angular/cli 8.2.5, mit Bootstrap4

1. Installieren Sie ngx-bootstrap

----Öffnen Sie die cmd-Konsole im Projektverzeichnis und geben Sie

----Use ein "--save" "Abhängigkeiten schreiben

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

2. Fügen Sie das entsprechende CSS in das Projekt ein

Fügen Sie den entsprechenden Pfad zum globalen Stil der Stile in der Datei angualr.json hinzu

 "styles": [
              "../node_modules/bootstrap/scss/bootstrap"
            ],
Nach dem Login kopieren

3. Importieren Sie die Abhängigkeiten

Führen Sie den globalen CSS-Stil ein. Wenn Sie die entsprechende Komponente verwenden möchten, müssen Sie die relevanten Abhängigkeiten in das entsprechende Modul importieren, um es normal verwenden zu können.

Führen Sie hier die Faltkomponente und die Tab-Komponente ein.

Führen Sie die Komponente zunächst im Kopf ein.

import {CollapseModule, TabsModule} from 'ngx-bootstrap';
Nach dem Login kopieren

Zweitens müssen Sie die Importe in die @NgModule-Anweisung importieren

@NgModule({
  imports: [
    TabsModule.forRoot(),
    CollapseModule.forRoot(),
  ],
})
Nach dem Login kopieren

Dann können Sie es verwenden

Verwandte Empfehlungen: Bootstrap-Tutorial

Das obige ist der detaillierte Inhalt vonWas ist NGX-Bootstrap?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage