consumir - ionic2: ¿Cómo se muestra el resultado seleccionado en la barra de búsqueda cuando se usa la barra de búsqueda iónica con API REST?
ionic 3 providers (0)
Quiero crear una lista desplegable con la barra de búsqueda con la lista que contiene datos de una API REST. Inicialmente, en la barra de búsqueda que creé, solo podía seleccionar el elemento pero no podía mostrarlo en la barra de búsqueda. Quiero que el elemento seleccionado se muestre en la barra de búsqueda. ¿Cómo puedo mostrar ese elemento seleccionado?
Necesito mostrarlo porque estoy construyendo una lista desplegable en cascada donde se sirve la entrada de la primera lista a la segunda lista.
Estaré agradecido si alguien me puede proporcionar el código al pensar que los datos se están procesando desde una API REST usando el método POST. Esta es mi función a la que se llama en la página html. userData es una matriz de tipo objeto ya que necesito obtener datos JSON. Recibo un error que dice que la propiedad toLowerCase no puede existir en el tipo Object.
loadusers(ev:any){
this.UserService.post(''search/getusers'',{}).subscribe(resp=>{
this.userData = resp.data;
console.log(this.userData);
},
err=>{console.log(err);},
()=>{});
let val = ev.target.value;
// if the value is an empty string don''t filter the items
if (val && val.trim() != '''') {
this.userData = this.userData.filter((item) => {
return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
})
}
}
Este es el archivo HTML donde intento mostrar los datos junto con una barra de búsqueda. Tampoco sé qué incluir en la función isChanged.
<ion-searchbar [(ngModel)]="mySearchInput" (ionInput)="loadusers($event)"></ion-searchbar>
<ion-content >
<ion-list radio-group [(ngModel)]="selectedValue">
<ion-item class="border" *ngFor="let val of userData">
<ion-label>{{val.name}}</ion-label>
<ion-radio class="resolvedState" value="{{val.name}}" (ionSelect)="isChanged(val)"></ion-radio>
</ion-item>
</ion-list>
¿Cuál es la mejor práctica para crear una barra de búsqueda con estas características?