FormStructure

constructor(title?: string, nodes?: Node[], validateActions?: Button[])

setFromGroup(formGroup: FormGroup): void

getFormGroup(): FormGroup

getControlById(controlId: string): AbstractControl | null

getNodeById<T extends Node>(nodeId: string): T

getActionById<T extends Node>(nodeId: string): Button

getValue<T>(): T

RawValue<T>(): T

patchValue<T>(newValue: DataSet<T>): boolean

reset(): boolean

remapValues(): void

isValid(): boolean

isInvalid(): boolean

addValidators(id: string, validators: Validator): void

addAsyncValidators(id: string, validators: AsyncValidator): void

setValidator(id: string, validators: Validator): void

setAsyncValidator(id: string, validators: AsyncValidator): void

createNodes(from: number, nodes: Node[]): void

removeNodes(nodes: Node[]): void

createFormControl(node: Node): void

removeFormControl(node: Node): void

createValidateActions(from: number, nodes: Button[]): void

removeValidateActions(nodes: Button[]): void

fromGroupSize(): number

addNodeEvent(node: Node): void

import { FormStructure, Input, Button, Dropdown, OptionChild } from 'mat-dynamic-form';
import { Validators } from '@angular/forms';

const structure = new FormStructure(
  'User Registration',
  [
    new Input('username', 'Username', '', null, false, 'person', 'Username is required', false, false, Validators.required),
    new Input('email', 'Email', '', null, false, 'email', 'Email is required', false, false, [Validators.required, Validators.email]),
    new Dropdown(
      'country',
      'Country',
      [
        new OptionChild('United States', 'us'),
        new OptionChild('Canada', 'ca'),
        new OptionChild('Mexico', 'mx')
      ],
      'us'
    )
  ],
  [
    new Button('submit', 'Submit', {
      type: 'click',
      style: 'primary',
      onEvent: ({ structure }) => {
        if (structure.isValid()) {
          const values = structure.getValue();
          console.log('Form submitted:', values);
        }
      }
    }, false, 'send', false, true)
  ]
);

// Configure appearance
structure.appearance = 'outline';
structure.nodeGrid = 2;
structure.maxParentHeight = '80vh';

// Get specific node
const usernameNode = structure.getNodeById<Input>('username');
console.log('Username:', usernameNode.value);

// Get specific control
const emailControl = structure.getControlById('email');
emailControl.setValue('[email protected]');

// Patch multiple values
structure.patchValue({
  username: 'johndoe',
  email: '[email protected]',
  country: 'ca'
});

// Get all values
const formData = structure.getValue<{
  username: string;
  email: string;
  country: string;
}>();

// Reset form
structure.reset();

import { Input, Checkbox } from 'mat-dynamic-form';

// Add new fields dynamically
const newFields = [
  new Input('phone', 'Phone Number', '', null, false, 'phone'),
  new Checkbox('newsletter', 'Subscribe to newsletter', false)
];

structure.createNodes(2, newFields); // Insert at position 2

// Remove fields
structure.removeNodes(newFields);

import { Validators } from '@angular/forms';

// Add validators to existing control
structure.addValidators('username', Validators.minLength(3));

// Replace validators
structure.setValidator('email', [
  Validators.required,
  Validators.email,
  Validators.pattern(/^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$/)
]);

// Add async validator
structure.addAsyncValidators('username', (control) => {
  return checkUsernameAvailability(control.value).pipe(
    map(available => available ? null : { usernameTaken: true })
  );
});

// Check validation status
if (structure.isValid()) {
  console.log('Form is valid');
} else {
  console.log('Form has errors');
}

import { AbstractControl, ValidationErrors } from '@angular/forms';

// Custom global validator
function noSpecialCharsValidator(control: AbstractControl): ValidationErrors | null {
  const hasSpecialChars = /[!@#$%^&*(),.?":{}|<>]/.test(control.value);
  return hasSpecialChars ? { specialChars: true } : null;
}

structure.globalValidators = noSpecialCharsValidator;

import { Button, ActionEvent } from 'mat-dynamic-form';

const submitButton = new Button(
  'submit',
  'Submit Form',
  {
    type: 'click',
    style: 'primary',
    onEvent: ({ event, structure }: ActionEvent) => {
      if (structure.isValid()) {
        const data = structure.getRawValue();
        submitToAPI(data);
      } else {
        console.error('Form is invalid');
      }
    }
  },
  false,
  'send',
  false,
  true, // validateForm
  ({ structure }) => {
    // Custom validation logic
    return structure.isValid() && structure.getValue().terms === true;
  }
);

const resetButton = new Button(
  'reset',
  'Reset',
  {
    type: 'click',
    style: 'warn',
    onEvent: ({ structure }) => {
      structure.reset();
    }
  }
);

structure.validateActions = [submitButton, resetButton];

pathValue<T>(newValue: DataSet<T>): boolean

isInalid(): boolean