Needless UI

ಕಾಂಪೊನೆಂಟ್‌ಗಳು

Calendar

ಒಂದು ದಿನ, ಶ್ರೇಣಿ ಅಥವಾ ಹಲವು ದಿನಗಳನ್ನು ಆರಿಸಿ, ಕೀಬೋರ್ಡ್‌ನಿಂದಲೂ.

ಇಂಪೋರ್ಟ್

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

NuiCalendar

ದಿನಗಳನ್ನು ಆರಿಸಲು ಒಂದು ಕ್ಯಾಲೆಂಡರ್.

ಸೆಲೆಕ್ಟರ್
nui-calendar
ಹೆಸರುಪ್ರಕಾರಡೀಫಾಲ್ಟ್ವಿವರಣೆ
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

ದಿನಗಳ ಶ್ರೇಣಿ.

ಹೆಸರುಪ್ರಕಾರಡೀಫಾಲ್ಟ್ವಿವರಣೆ
start, endಪ್ರಾಪರ್ಟಿNuiDateಮೊದಲ ಮತ್ತು ಕೊನೆಯ ದಿನಗಳು, ಎರಡೂ ಸೇರಿ.