Inttegro Web SDKs - v0.5.4
    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 features, orderId, presentation, 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"
          presentation="modal"
          [appearance]="{ theme: 'system' }"
          (completed)="onCompleted()"
          (failed)="onFailed($event)"
          (error)="onError($event)"
        />
      `,
    })
    export class PaymentPage {
      orderId = input.required<string>()
      onCompleted(): void { location.assign('/orders/complete') }
      onFailed(event: CheckoutFailedEvent): void {
        showCheckoutFailure(event.failure)
      }
      onError(error: Error): void {
        reportCheckoutError(error)
      }
    }

    Implements

    • AfterViewInit
    • OnChanges
    • OnDestroy
    Index
    constructor
    appearance? canceled completed error event failed features? locale? orderId? presentation purchaseIntentId? ready timeout? title?
    dismiss focus ngAfterViewInit ngOnChanges ngOnDestroy update
    appearance?: CheckoutAppearance

    Initial and reactive theme preference for hosted Checkout.

    canceled: EventEmitter<CheckoutCanceledEvent> = ...

    Emitted when a payer dismisses managed modal Checkout before completion.

    completed: EventEmitter<CheckoutCompletedEvent> = ...

    Emitted after Checkout reports its successful terminal state.

    error: EventEmitter<Error> = ...

    Emitted for loader or mount failures.

    event: EventEmitter<CheckoutEvent> = ...

    Emitted for every sanitized hosted Checkout lifecycle event.

    failed: EventEmitter<CheckoutFailedEvent> = ...

    Emitted when Checkout reaches a terminal failure state.

    features?: CheckoutFeatures

    Hosted Checkout content and actions. Changing it replaces the controller.

    locale?: string

    Initial and reactive BCP 47 locale preference.

    orderId?: string

    Client-safe reference for the finalized Order being paid.

    presentation: CheckoutPresentation = 'embedded'

    Displays Checkout inline by default or in an Inttegro-managed modal.

    purchaseIntentId?: string

    Client-safe fixed or customer-selected Purchase Intent. Mutually exclusive with orderId.

    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.

    • 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