generic-select.component.html

<mat-form-field>
    <mat-select [id]="selectId" [placeholder]="label" [(value)]="selectedValue"  [multiple]="isMultiple" (selectionChange) ="onValueChange($event)">
        <mat-select-trigger *ngIf="isMultiple">
            {{ selectedValue && selectedValue[0] ? entryLabel(selectedValue[0]) : '' }}
            <span *ngIf="selectedValue?.length > 1" class="multiple-selection-label">
                (+ {{ selectedValue.length - 1 }} {{ selectedValue?.length === 2 ? uitextAndOther : uitextAndOthers }})
            </span>
        </mat-select-trigger>
        <mat-option *ngFor="let e of entries" [value]="e" [title]="entryLabel(e)">
            {{ entryLabel(e) }}
        </mat-option>
    </mat-select>
    <button mat-button *ngIf="showClearButton" matSuffix mat-icon-button aria-label="Clear"
        (click)="cancelValue($event)">
        <mat-icon>close</mat-icon>
    </button>
    <div *ngIf="enableHelpButton" class="overlap-select">
        <mat-icon id="help-select" (click)="openHelp($event)" [title]="uitextOpenHelp" color="accent">
            help
        </mat-icon>
    </div>
</mat-form-field>
<div *ngIf="messageWhenEmpty" class="message-when-empty">
    {{ messageWhenEmpty }}
</div>