Skip to main content

form fields

Input binding​

Bind input with FormControl:

<glint-text-field [control]="formControl"/>

Bind input with 2-way binding:

<glint-text-field [(value)]="model.myField"/>

In combination with [glintFormContainer] to auto-register the form-fieldFieldA property of a DataElement expanded to a database column and user interface input element.:

<glint-text-field [(value)]="model.myField" formName="myField"/>

Form Container​

Glint provides a form container directive to automatically build a FormGroup instance for a form. This setup allows the updates to the model to be delayed until the form is submitted.

<form glintFormContainer [glintFormSubmit]="autoSubmit">
  <glint-text-field label="name" [(value)]="model.name" formName="name"/>
  <glint-text-field label="type" [(value)]="model.type" formName="type"/>
  <glint-text-field label="description" [(value)]="model.description" formName="description"/>
</form>
  • [glintFormContainer]: Adds form-container context so that form-fieldsFieldA property of a DataElement expanded to a database column and user interface input element. can be auto-registered. A FormGroup can be passed as value. Otherwise, a new one will be created.
  • [glintFormSubmit]: Pass an Observable. The form will trigger a submit each time the observable triggers.
  • [formName]: Name of the form fieldFieldA property of a DataElement expanded to a database column and user interface input element. in the FormGroup. The fieldFieldA property of a DataElement expanded to a database column and user interface input element. will only be registered if this value is defined.

Components​

These fieldsFieldA property of a DataElement expanded to a database column and user interface input element. are present on all glint form fieldFieldA property of a DataElement expanded to a database column and user interface input element. components.

  • label: (required) FieldFieldA property of a DataElement expanded to a database column and user interface input element. label describing the fieldFieldA property of a DataElement expanded to a database column and user interface input element. being edited.
  • description: (optional) Longer description that will appear below the fieldFieldA property of a DataElement expanded to a database column and user interface input element..

glint-text-field​

Simple text fieldFieldA property of a DataElement expanded to a database column and user interface input element..

<glint-text-field label="name" description="Some description"/>

glint-text-area-field​

Large text fieldFieldA property of a DataElement expanded to a database column and user interface input element. for multiline strings.

<glint-text-area-field label="name" description="Some description"/>

glint-checkbox-field​

Checkbox fieldFieldA property of a DataElement expanded to a database column and user interface input element. for boolean values.

<glint-checkbox-field label="isInfo" description="Some description"/>

glint-number-field​

Input fieldFieldA property of a DataElement expanded to a database column and user interface input element. for number values.

<glint-number-field label="amount" description="Some description"/>