ng-forge
What is Dynamic Forms? Installation
Material Design PREVIEW Bootstrap PREVIEW PrimeNG PREVIEW Ionic PREVIEW
Field Types Validation Conditional Logic Type Safety Form Submission Internationalization (i18n) Event Bus
Form Rows Form Groups Form Arrays Form Pages Text Components
User Registration Form Contact Form Login Form Paginated Form (Multi-Step) Conditional Logic Showcase
Expression Parser Security Configuration Custom Integrations
API Reference
dynamic-forms / Class

PageOrchestratorComponent

Decorators:@Component
Selectors:div[page-orchestrator]

PageOrchestrator manages page navigation and visibility for paged forms. It acts as an intermediary between the DynamicForm component and PageField components, handling page state management and navigation events without interfering with form data.

This component uses declarative rendering with @defer blocks for optimal performance, ensuring that non-visible pages are lazily loaded only when needed.

Key responsibilities:

  • Manage current page index state
  • Handle navigation events (next/previous)
  • Declaratively render pages with deferred loading
  • Emit page change events
  • Validate navigation boundaries

Constructor

No documentation has been provided.

Presentation
constructor(
	
): PageOrchestratorComponent;

Properties

NameTypeDescription
currentPageValid
r
Signal<boolean>

Signal indicating whether all fields on the current page are valid.

This is used by next page buttons to determine their disabled state. Returns true if all fields on the current page pass validation, false otherwise.

extendedFieldSignalContext
r
Signal<{ currentPageValid: Signal<boolean>; injector: Injector; value: WritableSignal<Partial<any> | undefined>; defaultValues: () => any; form: FieldTree<any>; defaultValidationMessages?: ValidationMessages | undefined; formOptions?: FormOptions | undefined; }>

Extended field signal context that includes currentPageValid.

This extends the parent context from DynamicForm with page-specific information needed by button mappers (e.g., next button needs to know if the current page is valid).

fieldSignalContext
InputSignal<FieldSignalContext<any>>

Field signal context for child fields

form
InputSignal<FieldTree<unknown>>

Root form instance from parent DynamicForm. Uses FieldTree to accept any form type.

pageFields
InputSignal<PageField<PageAllowedChildren[]>[]>

Array of page field definitions to render

pageHiddenStates
r
Signal<boolean[]>

Computed signal that tracks which pages are hidden. Returns an array of booleans where true means the page is hidden. This signal is reactive and will re-evaluate when form values change.

state
r
Signal<PageOrchestratorState>

Computed state for the orchestrator

visiblePageIndices
r
Signal<number[]>

Computed signal that returns indices of visible (non-hidden) pages. This is used for navigation to skip hidden pages.

Methods

Navigate to the next visible page, skipping hidden pages.

Presentation
navigateToNextPage(): NavigationResult;
Returns
NavigationResult -

Navigation result

Navigate to a specific page index

Presentation
navigateToPage(pageIndex: number): NavigationResult;
Parameters
NameTypeDescription
pageIndex
number

The target page index (0-based)

Returns
NavigationResult -

Navigation result

Navigate to the previous visible page, skipping hidden pages.

Presentation
navigateToPreviousPage(): NavigationResult;
Returns
NavigationResult -

Navigation result

Example usage

<div page-orchestrator
  [pageFields]="pageFields"
  [form]="form"
  [fieldSignalContext]="fieldSignalContext"
  [config]="orchestratorConfig"
  (pageChanged)="onPageChanged($event)"
  (navigationStateChanged)="onNavigationStateChanged($event)">
</div>