I am working on a template that includes mat-autocomplete for element searching, with individual option elements displayed. I am trying to implement logic where if an element is selected, the input should be disabled. How can I determine if a specific element has been selected in mat-autocomplete?
HTML
<input [matAutocomplete]="auto" matInput formControlName="targetListValue">
<mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let targetItem of filteredTargetListOptions" [value]="targetItem">
{{targetItem.value}}
</mat-option>
</mat-autocomplete>
Typescript
ifSelectedItem() {
if (// check if option has been selected) {
this.form.controls.targetListValue.disable();
}
}