Within the component.ts, I extract 15 different lookup list values and assign each one to a list, which is then bound to the corresponding <select> element in the HTML. This process functions correctly.
Is there a method to streamline this code for better readability?
<mat-form-field class="example-full-width">
<mat-label>Preferred Job</mat-label>
<mat-select>
<mat-option *ngFor="let job of designationList.filter(x=>x.lookupName === 'Designation')" [value]="job.id">
{{job.lookupValue}}
</mat-option>
</mat-select>
</mat-form-field>
Would it be possible to directly apply a where or filter condition within the <select> element so that separate lists are no longer needed for each dropdown menu?