الاستيراد

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

NuiTour

جولة إرشادية.

المُحدِّد
nui-tour
NuiTour: الخصائص
الاسمالنوعالقيمة الافتراضيةالوصف
stepsمُدخَلNuiTourStep[][]الخطوات، بالترتيب.
openثنائي الاتجاهbooleanfalseيحدد ما إذا كانت الجولة جارية.
stepثنائي الاتجاهnumber0الخطوة المعروضة، بدءًا من 0.
labelsمُدخَلPartial<NuiTourLabels>كل نص تعرضه الجولة، لترجمته.
finishedمُخرَجvoidيُطلَق عند إتمام الخطوة الأخيرة.
dismissedمُخرَجnumberيُطلق الخطوة التي انتهت عندها الجولة، إذا انتهت قبل أوانها.
startدالة(from?: number) => voidيبدأ الجولة، من الخطوة الأولى أو من الخطوة المحددة.
endدالة(finished: boolean) => voidيُنهي الجولة، مكتملةً أو قبل إتمامها.

NuiTourStep

خطوة من الجولة.

NuiTourStep: الخصائص
الاسمالنوعالقيمة الافتراضيةالوصف
targetخاصيةstring | Element | (() => Element | null)ما تُشير إليه. وبدونه تظهر البطاقة في المنتصف.
titleخاصيةstringعنوان البطاقة.
contentخاصيةstring | TemplateRefنصها، أو قالب.
sideخاصية'top' | 'bottom' | 'start' | 'end''bottom'الجهة التي تظهر فيها البطاقة بجوار الهدف.
alignخاصية'start' | 'center' | 'end''center'طريقة محاذاة البطاقة مع الهدف.
paddingخاصيةnumber8المساحة حول الهدف داخل بقعة الضوء، بالبكسل.
interactiveخاصيةbooleanfalseيمكن استعمال الهدف ما دامت البطاقة ظاهرة.
beforeShowخاصية() => void | Promise<void>يُنفَّذ قبل ظهور الخطوة. وإن أعاد وعدًا (promise)، انتظرته الجولة.