"ngx-bootstrap"은 Angular가 bootstrap3 또는 bootstrap4 구성 요소를 빠르게 상속하는 가장 좋은 방법으로, "npm install ngx-bootstrap --을 사용하여 설치할 수 있습니다. save" 명령. "ngx-bootstrap".
이 튜토리얼의 운영 환경: Windows 10 시스템, 부트스트랩 버전 5, DELL G3 컴퓨터
ngx-bootstrap은 Angular의 UI 프레임워크입니다. Bootstrap 3 또는 Bootstrap 4 구성 요소를 신속하게 통합하는 것이 가장 좋습니다. ngx-bootstrap은 개발 효율성을 향상시킬 수 있습니다.
여기서 사용되는 것은 bootstrap4
1이 포함된 @angular/cli 8.2.5입니다. ngx-bootstrap
을 설치하세요.----프로젝트 디렉터리에서 cmd 콘솔을 열고
을 입력하세요.----사용 "--save" "의존성 쓰기
npm install ngx-bootstrap --save // 也可以用国内的淘宝镜像快速安装 cnpm install ngx-bootstrap --save
2. 해당 CSS를 프로젝트에 도입합니다
angualr.json 파일의 스타일 전역 스타일에 해당 경로를 추가합니다
"styles": [ "../node_modules/bootstrap/scss/bootstrap" ],
3. 종속성 가져오기
글로벌 CSS 스타일 소개 해당 컴포넌트를 사용하려면 해당 모듈에서 관련 종속성을 가져와야 정상적인 사용이 가능합니다
여기서 접는 컴포넌트와 탭 컴포넌트를 소개합니다
먼저 헤드에 있는 컴포넌트를 소개합니다
import {CollapseModule, TabsModule} from 'ngx-bootstrap';
두 번째로 @NgModule 문에서 가져오기를 가져와야 합니다
@NgModule({ imports: [ TabsModule.forRoot(), CollapseModule.forRoot(), ], })
그런 다음 사용할 수 있습니다
관련 권장 사항:부트스트랩 튜토리얼
위 내용은 ngx 부트스트랩이란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!