Import

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

NuiCalendar

Một lịch để chọn ngày.

Selector
nui-calendar
NuiCalendar: Thuộc tính
TênKiểuMặc địnhMô tả
selectionInput'single' | 'range' | 'multiple''single'Có thể chọn bao nhiêu ngày.
valueHai chiềuNuiDate | nullnullNgày được chọn.
valuesHai chiềuNuiDate[][]Các ngày được chọn, theo thứ tự.
rangeHai chiềuNuiDateRange | nullnullKhoảng ngày được chọn, bao gồm cả hai đầu.
monthHai chiềuNuiMonth | nullnullTháng đang hiển thị; là tháng đầu tiên nếu hiển thị nhiều tháng.
viewHai chiều'day' | 'month' | 'year''day'Ngày, tháng hoặc năm.
min, maxInputNuiDate | nullNgày đầu tiên và cuối cùng có thể chọn.
unavailableInput(date: NuiDate) => booleanLoại trừ các ngày khác, chẳng hạn ngày lễ.
monthsInputnumber1Số tháng hiển thị cạnh nhau.
weekNumbersInputbooleanfalseHiển thị số tuần ISO.
firstDayInput1 … 7Ngày đầu tuần, 1 là thứ Hai. Mặc định theo locale.
localeInputstringLOCALE_IDĐịnh dạng tên và chữ số, và chọn ngày đầu tuần.
labelsInputPartial<NuiCalendarLabels>Mọi văn bản mà lịch hiển thị hoặc đọc lên, để dịch.
cornersInputNuiCornersHình dạng các góc: round, squircle, bevel, scoop, notch hoặc square.
radiusInputNuiRadiusMức bo góc: none, small, medium, large hoặc full.
densityInputNuiDensityLượng không gian mà component chiếm: compact, regular hoặc roomy.
pickedOutputNuiDate | NuiDateRangePhát ra mỗi lựa chọn: một ngày, hoặc một khoảng ngày khi đã hoàn tất.
focusDatePhương thức(date?: NuiDate) => voidChuyển focus bàn phím tới một ngày và hiển thị tháng của ngày đó.

Các input tùy biến mà bạn không đặt sẽ lấy giá trị từ thuộc tính data-nui-* gần nhất. Xem hướng dẫn tùy biến.

NuiDateRange

Một khoảng ngày.

NuiDateRange: Thuộc tính
TênKiểuMặc địnhMô tả
start, endThuộc tínhNuiDateNgày đầu tiên và cuối cùng, bao gồm cả hai.