Inttegro Web SDKs - v0.1.0
    Preparing search index...

    Class CheckoutComponent

    Standalone Angular component that embeds Inttegro-hosted Checkout.

    Add the component to a host component's imports array. It loads the hosted runtime after its view initializes, creates one controller, and destroys that controller with the Angular view. Changing orderId, timeout, or title replaces the controller; changing appearance or locale updates it in place.

    Keep this component mounted while a payment attempt or confirmation is pending. The successful completed output is suitable for navigation, but fulfillment must use server-retrieved Order state or a signed webhook.

    @Component({
      standalone: true,
      imports: [CheckoutComponent],
      template: `
        <inttegro-checkout
          [orderId]="orderId"
          [appearance]="{ theme: 'system' }"
          (completed)="onCompleted()"
          (error)="onError($event)"
        />
      `,
    })
    export class PaymentPage {
      orderId = input.required<string>()
      onCompleted(): void { location.assign('/orders/complete') }
      onError(error: CheckoutErrorEvent | Error): void {
        reportCheckoutError(error)
      }
    }

    Implements

    • AfterViewInit
    • OnChanges
    • OnDestroy
    Index
    constructor
    appearance? completed error event locale? orderId ready timeout? title?
    focus ngAfterViewInit ngOnChanges ngOnDestroy update
    appearance?: CheckoutAppearance

    Initial and reactive theme preference for hosted Checkout.

    completed: EventEmitter<CheckoutCompletedEvent> = ...

    Emitted after Checkout reports its successful terminal state.

    error: EventEmitter<Error | CheckoutErrorEvent> = ...

    Emitted for loader/mount failures and sanitized hosted errors.

    event: EventEmitter<CheckoutEvent> = ...

    Emitted for every sanitized hosted Checkout lifecycle event.

    locale?: string

    Initial and reactive BCP 47 locale preference.

    orderId: string = ''

    Client-safe reference for the finalized Order being paid.

    ready: EventEmitter<CheckoutReadyEvent> = ...

    Emitted once the iframe is interactive.

    timeout?: number

    Mount timeout from 1,000–60,000 ms; defaults to 15,000 ms.

    title?: string

    Accessible iframe title; defaults to Checkout.

    • Moves focus into hosted Checkout when its controller is ready. Before initialization or after teardown this method safely does nothing.

      Returns void

    • A callback method that is invoked immediately after Angular has completed initialization of a component's view. It is invoked only once when the view is instantiated.

      Returns void

    • A callback method that is invoked immediately after the default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.

      Parameters

      • changes: { [propName: string]: SimpleChange<any> }

        The changed properties.

      Returns void

    • A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.

      Returns void

    • Applies a new locale or color scheme when a controller exists. Prefer binding appearance and locale for declarative Angular views.

      Parameters

      • options: CheckoutUpdateOptions

      Returns void

    Settings
    Member Visibility

    On This Page
    Constructors
    Properties
    Methods