가져오기

import-calendar.ts
import { NuiCalendar, type NuiDateRange } from '@needless-ui/angular/calendar';

NuiCalendar

날짜를 선택하는 캘린더입니다.

셀렉터
nui-calendar
NuiCalendar: 속성
이름타입기본값설명
selection입력'single' | 'range' | 'multiple''single'선택할 수 있는 날짜 수.
value양방향NuiDate | nullnull선택된 날짜.
values양방향NuiDate[][]선택된 날짜들. 날짜순으로 정렬됩니다.
range양방향NuiDateRange | nullnull선택된 기간. 양 끝 날짜를 포함합니다.
month양방향NuiMonth | nullnull표시된 달. 여러 달을 표시할 때는 첫 번째 달입니다.
view양방향'day' | 'month' | 'year''day'일, 월, 연도 보기 중 하나.
min, max입력NuiDate | null선택할 수 있는 첫날과 마지막 날.
unavailable입력(date: NuiDate) => boolean공휴일처럼 그 밖에 선택할 수 없는 날을 지정합니다.
months입력number1나란히 표시할 달의 수.
weekNumbers입력booleanfalseISO 주 번호를 표시합니다.
firstDay입력1 … 7한 주의 첫 요일로, 1은 월요일입니다. 기본값은 로케일을 따릅니다.
locale입력stringLOCALE_ID이름과 숫자의 서식을 정하고 한 주의 첫 요일을 고르는 로케일.
labels입력Partial<NuiCalendarLabels>캘린더가 표시하거나 읽어 주는 모든 텍스트. 번역할 때 사용합니다.
corners입력NuiCorners모서리 모양: round, squircle, bevel, scoop, notch, square 중 하나.
radius입력NuiRadius모서리 크기: none, small, medium, large, full 중 하나.
density입력NuiDensity차지하는 공간: compact, regular, roomy 중 하나.
picked출력NuiDate | NuiDateRange선택 결과를 내보냅니다. 날짜는 선택할 때마다, 기간은 완성되었을 때 내보냅니다.
focusDate메서드(date?: NuiDate) => void키보드 포커스를 특정 날짜로 옮기고, 그 날짜가 있는 달을 표시합니다.

설정하지 않은 커스터마이징 입력은 가장 가까운 data-nui-* 속성을 따릅니다. 자세한 내용은 커스터마이징 가이드를 참고하시기 바랍니다.

NuiDateRange

날짜 기간.

NuiDateRange: 속성
이름타입기본값설명
start, end속성NuiDate첫날과 마지막 날. 둘 다 기간에 포함됩니다.