Configure global defaults for all forms at provider level, or per-form via defaultProps.

The Cascade

ng-forge applies props in priority order — more specific always wins:

Library-level
withXxxFields({...})All forms
Form-level
defaultPropsOne form
Field-level
propsOne field

Config Options

Pass these to withMaterialFields({ ... }) for library-level defaults, or to defaultProps for form-level defaults.

OptionTypeDefaultDescription
appearance'fill' | 'outline''outline'Default appearance for Material form fields
subscriptSizing'fixed' | 'dynamic''dynamic'Controls space reserved for hint/error messages
disableRipplebooleanfalseDisable Material ripple effects on interactive controls
color'primary' | 'accent' | 'warn''primary'Default theme color for checkboxes, radios, sliders, and toggles
labelPosition'before' | 'after''after'Default label position for checkboxes and radios
floatLabel'auto' | 'always' | 'never''auto'Default float label behavior for Material form fields ('auto', 'always', or 'never')
hideRequiredMarkerbooleanfalseHide the required asterisk on form fields by default

Library-level (provider)

provideDynamicForm(
  ...withMaterialFields({
    appearance: 'outline',
    subscriptSizing: 'dynamic',
    color: 'primary',
    disableRipple: false,
    labelPosition: 'after',
  })
)

Form-level (defaultProps)

Use MatFormConfig from @ng-forge/dynamic-forms-material for type-safe defaultProps with autocomplete. 

import { MatFormConfig } from '@ng-forge/dynamic-forms-material';

const config = {
  defaultProps: {
    appearance: 'fill',  // overrides the library-level setting
    color: 'accent',
  },
  fields: [
    { type: 'input', key: 'name', label: 'Name' },
    // This field overrides at field level:
    { type: 'input', key: 'email', label: 'Email', props: { appearance: 'outline' } },
  ],
} as const satisfies MatFormConfig;

Field-level Props

Each field type also accepts its own adapter-specific props. See Field Types for the full per-field reference.

Nullable values

Value fields accept an optional nullable?: boolean flag. When true:

  • value accepts null in addition to the field's normal type (e.g. string | null).
  • An omitted value resolves to null instead of the type-specific empty default ('', NaN, [], …).
  • nullable stays orthogonal to required — they describe different layers. nullable declares that the model accepts null (data shape). required is a validation constraint. Angular's Validators.required treats null as invalid, so a field that is both nullable and required will fail required-validation when the value is null. The flags are independent OpenAPI concepts; combine them if that matches your schema, but understand the runtime interaction.
{
  key: 'middleName',
  type: 'input',
  label: 'Middle Name',
  nullable: true,
  value: null,       // allowed; also the resolved default when omitted
}

Read-side caveat. A user clearing a text input reads back as "", not null — this is a DOM/Web IDL contract, identical to classic Reactive Forms. nullable is a contract for accepted values, not a guarantee of emitted ones. If your backend distinguishes null from empty string, handle the coercion at submission.

Next Steps