> 웹 프론트엔드 > 프런트엔드 Q&A > ngx 부트스트랩이란 무엇입니까?

ngx 부트스트랩이란 무엇입니까?

WBOY
풀어 주다: 2022-08-01 18:07:34
원래의
2929명이 탐색했습니다.

"ngx-bootstrap"은 Angular가 bootstrap3 또는 bootstrap4 구성 요소를 빠르게 상속하는 가장 좋은 방법으로, "npm install ngx-bootstrap --을 사용하여 설치할 수 있습니다. save" 명령. "ngx-bootstrap".

ngx 부트스트랩이란 무엇입니까?

이 튜토리얼의 운영 환경: Windows 10 시스템, 부트스트랩 버전 5, DELL G3 컴퓨터

ngx 부트스트랩이란 무엇입니까

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿