Needless UI

Components

Tour

Kati ga kowane mataki, kusa da abin da yake bayani a kai, da sauran shafin a dusashe a kewaye.

Shigo da shi

import-tour.ts
import { NuiTour, type NuiTourStep } from '@needless-ui/angular/tour';

NuiTour

Rangadi mai jagora.

Selector
nui-tour
SunaIriNa asaliBayani
stepsInputNuiTourStep[][]Matakan, bi da bi.
openHanya biyubooleanfalseKo rangadin yana gudana.
stepHanya biyunumber0Matakin da ake nunawa, daga 0.
labelsInputPartial<NuiTourLabels>Kowane rubutu da yake nunawa, don fassarawa.
finishedOutputvoidYana fitarwa idan an kammala mataki na ƙarshe.
dismissedOutputnumberYana fitar da matakin da rangadin ya ƙare a kai, idan ya ƙare da wuri.
startMethod(from?: number) => voidYana fara rangadin, daga mataki na farko ko wanda aka bayar.
endMethod(finished: boolean) => voidYana ƙare rangadin, a matsayin wanda aka kammala ko wanda aka watsar.

NuiTourStep

Mataki ɗaya na rangadin.

SunaIriNa asaliBayani
targetKadarastring | Element | (() => Element | null)Abin da yake nuni zuwa gare shi. Idan babu, katin yana bayyana a tsakiya.
titleKadarastringTaken katin.
contentKadarastring | TemplateRefRubutunsa, ko template.
sideKadara'top' | 'bottom' | 'start' | 'end''bottom'Gefen target ɗin da katin zai kasance.
alignKadara'start' | 'center' | 'end''center'Yadda katin ke daidaita da target ɗin.
paddingKadaranumber8Sarari kewaye da target ɗin a cikin hasken, a pixels.
interactiveKadarabooleanfalseAna iya amfani da target ɗin yayin da katin ke buɗe.
beforeShowKadara() => void | Promise<void>Yana aiki kafin matakin ya bayyana. Idan ya dawo da promise, rangadin yana jiran sa.