Disculpas por adelantado si esta pregunta se ha hecho antes, he revisado algunos artículos de ayuda, pero desafortunadamente no puedo hacer que nada funcione correctamente cuando se trata de mi código, la respuesta podría ser simple, por lo tanto, pido ayuda.

Básicamente, estoy tratando de implementar la funcionalidad de búsqueda inteligente (autocompletar) donde tiene una lista fija (actualmente implementada como etiqueta de selección), cuando el usuario escribe caracteres, reduce la lista para el usuario. Lo que he hecho actualmente es este archivo (en html),

activo.componente.html

 <div class="form-group"> <h5><label for="assetId" class="form-label text-right" style="margin: 10pt">Title</label></h5> <select id="assetId" name="id" #assetId="ngModel" required [class.is-invalid]="assetId.invalid" class="form-control is-invalid" [(ngModel)]="selectedAsset" (change)="getAssetValue()"> <option *ngFor="let asset of assets" value="{{asset.id}}-{{asset.text}}">{{asset.text}}</option> </select> </div>

Para el mismo ejemplo, podemos suponer que los activos son una matriz con campos de identificación y texto definidos en el archivo asset.component.ts

Miré la siguiente URL , pero como soy muy nuevo en todo esto, no pude hacer que esto funcione y agradecería si alguien pudiera ayudarme con esto. Gracias