first-npm-package-nicule/material-inputs/components/options/select-other-field.component.html

This isi first npm package

<div class="first-input">
    <label [for]="'form-field-' + field.name + '-' + uniqueIdentifier">{{label | translate}}<ng-container *ngIf="field.required">*</ng-container>
    </label>
    <mat-form-field floatLabel="never">
        <mat-select #select [value]="selectValue" [id]="'form-field-' + field.name + '-' + uniqueIdentifier" [placeholder]="placeholder" [disabled]="field.isDisabled || disabled"
            [matTooltip]="tooltip" [errorStateMatcher]="matcher">
            <mat-option value="" *ngIf="!settings['disableEmptyValue']" (click)="onSelect(select)">{{ 'selectInputPlaceholder' | translate }}</mat-option>
            <mat-option *ngFor="let option of options" [value]="option.value" (click)="onSelect(select)">
                {{ option.name | translate }}
            </mat-option>
            <mat-option [value]="'other'" (click)="onSelect(select)">{{ otherSelectOption | translate }}</mat-option>
        </mat-select>
    </mat-form-field>

    <ng-container *ngIf="!showTextField">
        <div *ngFor="let error of errors" class="first-input-error">
            {{error.message | translate: error.payload }}
        </div>
    </ng-container>

</div>

<div class="second-input" *ngIf="showTextField">
    <label [for]="'form-field-' + field.name">{{label + 'other' | translate}}
        <ng-container *ngIf="field.required">*</ng-container>
    </label>
    <mat-form-field input-container floatLabel="never" #textField>
        <input appInputFocus matInput type="text" onvTooltip [value]="textFieldValue" [matTooltip]="tooltip" [placeholder]="placeholder"
            [pattern]="field.pattern" (keyup)="onKeyUp(textField)" [errorStateMatcher]="matcher"/>
        <mat-hint *ngFor="let error of errors" class="second-input-error">
            {{error.message | translate: error.payload }}
        </mat-hint>
    </mat-form-field>
</div>

<input type="hidden" [name]="field.name" [value]="field.value" [ngModel]="field.value" [required]="field.required" />