New: Headless Commerce with Remix! read more

registerFormInputComponent

registerFormInputComponent

Registers a custom FormInputComponent which can be used to control the argument inputs of a ConfigurableOperationDef (e.g. CollectionFilter, ShippingMethod etc) or for a custom field.

Example

@NgModule({
  imports: [SharedModule],
  declarations: [MyCustomFieldControl],
  providers: [
      registerFormInputComponent('my-custom-input', MyCustomFieldControl),
  ],
})
export class MyUiExtensionModule {}

This input component can then be used in a custom field:

Example

const config = {
  // ...
  customFields: {
    ProductVariant: [
      {
        name: 'rrp',
        type: 'int',
        ui: { component: 'my-custom-input' },
      },
    ]
  }
}

or with an argument of a ConfigurableOperationDef:

Example

args: {
  rrp: { type: 'int', ui: { component: 'my-custom-input' } },
}

Signature

function registerFormInputComponent(id: string, component: Type<FormInputComponent>): FactoryProvider

Parameters

id

parameter
type:
string

component

parameter
type:
Type<FormInputComponent>