formischFieldArray

Structural directive that creates a typed field array store for a path and exposes it as the implicit context of the template. It is exported as the FormischFieldArray class.

<ng-container *formischFieldArray="['todos'] of form; let fieldArray">
  <!-- Field array content here -->
</ng-container>

Generics

• TSchema extends FormSchema
• TFieldArrayPath extends RequiredPath

Inputs

• formischFieldArray ValidArrayPath<v.InferInput<TSchema>, TFieldArrayPath>
• formischFieldArrayOf FormStore<TSchema>

Context

• $implicit FieldArrayStore<TSchema, TFieldArrayPath>

Explanation

The *formischFieldArray directive is a thin wrapper around injectFieldArray that lets you create a field array directly in your template. The path is the expression before the of keyword, and the form store follows it, which allows the context guard to infer the type of the array.

Render the items with an @for block over fieldArray.items() and use the item identifier as the track expression. The identifiers are stable across reorders, so Angular moves the existing DOM instead of recreating it. Combine the index of the @for block with *formischField to address the fields of an item, and use the insert, move, remove, replace and swap methods to change the array.

To import the directive, add the FormischFieldArray class to the imports array of your component.

Related

The following APIs can be combined with formischFieldArray.

Functions

• injectFieldArray,
• injectForm

Directives

• formischField,
• formischForm,
• formischControl

Methods

• insert,
• move,
• remove,
• replace,
• swap,
• validate