Skip to main content

glint-select-field

FieldFieldA property of a DataElement expanded to a database column and user interface input element. with dropdown to select 1 value from a number of options. Options can be filtered by typing in a search fieldFieldA property of a DataElement expanded to a database column and user interface input element..

<glint-select-field label="type" description="Pick one"
                    [options]="['Primary', 'Registry', 'History']"
                    [nullable]="false"/>
  • [options]: An array of options to choose from.
  • [nullable] (default=true): If false, the first option will be selected by default and the fieldFieldA property of a DataElement expanded to a database column and user interface input element. cannot be emptied.

Different representation​

<glint-select-field label="type" description="Pick one"
                    [options]="typeOptions"
                    [textValue]="toName">
  <ng-template let-option>
    <div>{{ option.name }}</div>
    <div class="glint-text-mute">{{option.description}}</div>
  </ng-template>
</glint-select-field>
  • [textValue]: Function that converts an option to a string. This is used to display the options in the input fieldFieldA property of a DataElement expanded to a database column and user interface input element. and filter options when typing.
  • <ng-template>: Template used to render options in the dropdown.

Add option​

It is possible to allow the user to create a new option from the text they entered in the search fieldFieldA property of a DataElement expanded to a database column and user interface input element..

<glint-select-field label="type" description="Pick one"
                    [options]="typeOptions"
                    [textValue]="toName"
                    [createNew]="createNew"
                    addMessage="New Type"/>
  • [createNew]: Function that takes { name: string } and return a new option instance.
  • [addMessage]: Define the message used to suggest creating a new option.