Search code examples
angularinfragisticsignite-uiignite-ui-angular

How to apply a default value to an IgxSelectComponent


What is the recommended way to apply a default value to an IgxSelectComponent using a template like this?:

<igx-select type="string" formControlName="classification">
    <label igxLabel>Classification</label>
    <igx-select-item *ngFor="let classification of classifications$ |async" [value]="classification">
        {{classification}}
    </igx-select-item>
</igx-select>

Thanks in advance!


Solution

  • You could set a default value to IgxSelectComponent using the ngModel directive and bind it to a global variable where is stored the required default value:

    <igx-select [(ngModel)]="selected">
      <label igxLabel>Simple Select</label>
      <igx-select-item *ngFor="let item of items" [value]="item">
        {{item}}
      </igx-select-item>
    </igx-select>
    

    Here could be found a simple sample application that you could test on your side.

    Also, a useful topic about Infragistics Select Component could be found here.