구성요소 템플릿

    다음 표에서는 Ignite UI Angular Schematics 또는 Ignite UI CLI 명령을 사용하여 생성할 수 있는 Ignite UI Angular 구성 요소 목록을 제공합니다. 또한 설명서에서 사용 가능한 데모에 대한 링크를 찾을 수 있지만 이는 CLI에서 생성된 것과 정확히 동일하지는 않습니다.

    주형 코드 및 설명 데모
    그리드 및 목록
    그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c grid newGrid
    Ignite UI CLI:
    ig add grid newGrid
    IgxGrid의 기본 템플릿입니다.
    		 자동 생성된 열이 있는 IgxGrid 구성요소
    그리드 일괄 편집 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c grid-batch-editing newGridBatchEditing
    Ignite UI CLI:
    ig add grid-batch-editing newGridBatchEditing
    일괄 편집이 포함된 샘플 IgxGrid.
    		 일괄 편집을 위해 Transaction 서비스를 사용하는 IgxGrid
    맞춤형 그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c custom-grid newCustomGrid
    Ignite UI CLI:
    ig add custom-grid newCustomGrid
    정렬, 필터링, 편집 등과 같은 선택적 기능을 갖춘 IgxGrid
    		 정렬, 필터링, 셀 편집, 행 편집, 그룹화, 크기 조정, 선택, 페이징, 열 고정, 열 이동, 열 숨기기와 같은 선택적 기능이 포함된 IgxGrid
    그리드 요약 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c grid-summaries newGridSummaries
    Ignite UI CLI:
    ig add grid-summaries newGridSummaries
    요약 기능이 있는 IgxGrid.
    		 요약 기능이 있는 IgxGrid.
    그리드 다중 열 헤더 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c grid-multi-column-headers newGridMultiColumnHeaders
    Ignite UI CLI:
    ig add grid-multi-column-headers newGridMultiColumnHeaders
    여러 헤더 열이 있는 IgxGrid.
    		 다중 열 헤더가 있는 IgxGrid
    트리 그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c custom-tree-grid newCustomTreeGrid
    Ignite UI CLI:
    ig add custom-tree-grid newCustomTreeGrid
    정렬, 필터링, 행 편집 등과 같은 선택적 기능을 갖춘 IgxTreeGrid
    		 정렬, 필터링, 셀 편집, 행 편집, 크기 조정, 행 선택, 페이징, 열 고정, 열 이동, 열 숨기기와 같은 선택적 기능이 포함된 IgxTreeGrid
    목록 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c list newList
    Ignite UI CLI:
    ig add list newList
    기본 IgxList.
    		 검색 및 필터링 논리가 포함된 IgxList입니다.
    콤보 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c combo newCombo
    Ignite UI CLI:
    ig add combo newCombo
    템플릿이 포함된 기본 IgxCombo.
    		 사용자 정의 템플릿을 사용하는 IgxCombo.
    차트
    카테고리 차트 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c category-chart newCategoryChart
    Ignite UI CLI:
    ig add category-chart newCategoryChart
    차트 유형 선택기가 있는 기본 카테고리 차트입니다.
    		 차트 유형 선택기가 있는 기본 카테고리 차트 입니다.
    금융 차트 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c financial-chart newFinancialChart
    Ignite UI CLI:
    ig add financial-chart newFinancialChart
    자동 도구 모음 및 유형 선택 기능이 있는 기본 재무 차트입니다.
    		 자동 도구 모음 및 유형 선택 기능이 있는 기본 재무 차트입니다.
    게이지
    글머리 기호 그래프 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c bullet-graph newBulletGraph
    Ignite UI CLI:
    ig add bullet-graph newBulletGraph
    다양한 애니메이션이 포함된 IgxBulletGraph
    		 다양한 애니메이션이 포함된 IgxBulletGraph​
    선형 게이지 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c linear-gauge newLinearGauge
    Ignite UI CLI:
    ig add linear-gauge newLinearGauge
    다양한 애니메이션이 포함된 IgxLinearGauge
    		 다양한 애니메이션이 포함된 IgxLinearGauge​
    방사형 게이지 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c radial-gauge newRadialGauge
    Ignite UI CLI:
    ig add radial-gauge newRadialGauge
    다양한 애니메이션이 포함된 IgxRadialGauge
    		 다양한 애니메이션이 포함된 IgxRadialGauge​
    레이아웃
    부두 관리자 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c dock-manager newDockManager
    Ignite UI CLI:
    ig add dock-manager newDockManager
    기본 IgcDockManager.
    		 9개의 콘텐츠 슬롯이 있는 IgcDockManager.
    회전목마 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c carousel newCarousel
    Ignite UI CLI:
    ig add carousel newCarousel
    기본 IgxCarousel.
    		 IgxCarousel은 일련의 이미지를 순환합니다.
    탭 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c tabs newTabs
    Ignite UI CLI:
    ig add tabs newTabs
    기본 IgxTabs.
    		 세 개의 사용자 정의 탭 그룹을 포함하는 IgxTabs 구성 요소입니다.
    하단 탐색 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c bottom-nav newBottomNav
    Ignite UI CLI:
    ig add bottom-nav newBottomNav
    3개 항목 하단 탐색 템플릿.
    		 3개 항목 하단 탐색 모음 템플릿.
    데이터 입력 및 표시
    칩 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c chip newChip
    Ignite UI CLI:
    ig add chip newChip
    기본 IgxChip.
    		 igx-chips-area 내부의 IgxChip 구성 요소.
    쓰러지 다 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c dropdown newDropDown
    Ignite UI CLI:
    ig add dropdown newDropDown
    기본 IgxDropDown.
    		 항목 목록을 표시하는 기본 IgxDropDown입니다.
    선택 (v4.1.0) Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c select newSelect
    Ignite UI CLI:
    ig add select newSelect
    기본 IgxSelect.
    		 항목 목록을 표시하는 간단한 IgxSelect..
    선택 (v4.1.0) Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c select-groups newGroupsSelect
    Ignite UI CLI:
    ig add select-groups newGroupsSelect
    그룹 포함을 선택합니다.
    		 그룹화된 항목을 표시하는 IgxSelect.
    선택 (v4.1.0) Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c select-in-form newFormSelect
    Ignite UI CLI:
    ig add select-in-form newFormSelect
    IgxSelect를 양식으로 선택하세요.
    		 양식의 IgxSelect 구성요소 사용.
    입력 그룹 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c input-group newInputGroup
    Ignite UI CLI:
    ig add input-group newInputGroup
    기본 IgxInputGroup 양식 보기.
    		 ​IgxInputGroup으로 생성된 양식 보기입니다.
    상호 작용
    대화 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c dialog newDialog
    Ignite UI CLI:
    ig add dialog newDialog
    기본 IgxDialog.
    		 표준 확인 대화 상자로 사용되는 IgxDialog의 샘플입니다.
    툴팁 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c tooltip newTooltip
    Ignite UI CLI:
    ig add tooltip newTooltip
    완전히 사용자 정의 가능한 툴팁입니다.
    		 ​IgxTooltip으로 생성된 기본 툴팁입니다.
    스케줄링
    날짜 선택기 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c date-picker newDatePicker
    Ignite UI CLI:
    ig add date-picker newDatePicker
    기본 IgxDatePicker.
    		 단방향 데이터 바인딩을 사용하는 기본 IgxDatePicker입니다.
    시간 선택기 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c time-picker newTimePicker
    Ignite UI CLI:
    ig add time-picker newTimePicker
    기본 IgxTimePicker.
    		 초기 값이 설정되고 단방향 데이터 바인딩이 포함된 기본 IgxTimePicker 입니다.
    달력 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c calendar newCalendar
    Ignite UI CLI:
    ig add calendar newCalendar
    단일 선택이 가능한 IgxCalendar.
    		 단방향 데이터 바인딩을 사용하는 기본 IgxDatePicker입니다.

    Scenario templates

    주형 코드 및 설명 데모
    멋진 그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c awesome-grid newAwesomeGrid
    Ignite UI CLI:
    ig add awesome-grid newAwesomeGrid
    사용자 정의 셀 템플릿이 포함된 IgxGrid.
    		 셀 템플릿과 컨트롤이 셀에 내장된 IgxGrid 입니다.
    crm-그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c crm-grid newCrmGrid
    Ignite UI CLI:
    ig add crm-grid newCrmGrid
    사용자 정의 검색 구현이 포함된 IgxGrid.
    		 사용자 정의 검색 구현이 포함된 IgxGrid.
    핀테크 그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c fintech-grid newFinTechGrid
    Ignite UI CLI:
    ig add fintech-grid newFinTechGrid
    IgxGrid는 초당 수천 개의 실시간 업데이트를 처리합니다.
    		 초당 수천 개의 업데이트를 처리하는 IgxGrid Live Update 데모입니다.
    핀테크 트리 그리드 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c fintech-tree-grid newFinTechTreeGrid
    Ignite UI CLI:
    ig add fintech-tree-grid newFinTechTreeGrid
    IgxGrid는 초당 수천 개의 실시간 업데이트를 처리합니다.
    		 초당 수천 개의 업데이트를 처리하는 IgxTreeGrid Live Update 데모입니다.
    로그인 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c login newLogin
    Ignite UI CLI:
    ig add login newLogin
    IgxInputGroup으로 생성된 등록 및 로그인 양식입니다.
    		 ​IgxInputGroup으로 생성된 등록 및 로그인 양식 ..
    일기 예보 Ignite UI Schematics collection:
    ng g @igniteui/angular-schematics:c weather-forecast newWeatherForecast
    Ignite UI CLI:
    ig add weather-forecast newWeatherForecast
    igxExpansionPanel이 포함된 템플릿.
    		 템플릿은 IgxExpansionPanel을 사용하여 일일 일기 예보 세부 정보를 표시합니다.