Necesito hacer un search bar para mi aplicación pero la lista que creo la obtengo de un servicio que lo guarda en un observable y no sé como obtener los datos para llamar a los métodos de la search bar (a lo mejor guardando en un array los nombres).
El Json que guardo en mi observable es el siguiente:
[
{
"id": 1,
"nombre": "GoParken",
"tecnologias": [
{
"nombre": "PHP",
"icono": "https://cdn1.iconfinder.com/data/icons/simple-icons/4096/php-4096-black.png"
},
{
"nombre": "IONIC",
"icono": "https://s-media-cache-ak0.pinimg.com/originals/dd/ec/17/ddec173bbaa672d3a45f6a41b9891eb3.png"
}
],
"g_index": 98
},
{
"id": 2,
"nombre": "Mercado de Ideas",
"tecnologias": [
{
"nombre": ".NET",
"icono": "http://getsetwebsite.com/wp-content/uploads/2016/07/net.png"
},
{
"nombre": "IONIC",
"icono": "https://s-media-cache-ak0.pinimg.com/originals/dd/ec/17/ddec173bbaa672d3a45f6a41b9891eb3.png"
}
],
"g_index": 98
},
{
"id": 3,
"nombre": "Wowlandia",
"tecnologias": [
{
"nombre": "PHP",
"icono": "https://cdn1.iconfinder.com/data/icons/simple-icons/4096/php-4096-black.png"
},
{
"nombre": "COCOS 2D",
"icono": "http://www.xappsoftware.com/wordpress/wp-content/uploads/2012/07/cocos2d_banner.png"
}
],
"g_index": 20
},
{
"id": 4,
"nombre": "Dilo con señas",
"tecnologias": [
{
"nombre": "PHP",
"icono": "https://cdn1.iconfinder.com/data/icons/simple-icons/4096/php-4096-black.png"
},
{
"nombre": "IONIC",
"icono": "https://s-media-cache-ak0.pinimg.com/originals/dd/ec/17/ddec173bbaa672d3a45f6a41b9891eb3.png"
}
],
"g_index": 18
},
{
"id": 5,
"nombre": "Bandala",
"tecnologias": [
{
"nombre": "PHP",
"icono": "https://cdn1.iconfinder.com/data/icons/simple-icons/4096/php-4096-black.png"
},
{
"nombre": "IONIC",
"icono": "https://s-media-cache-ak0.pinimg.com/originals/dd/ec/17/ddec173bbaa672d3a45f6a41b9891eb3.png"
}
],
"g_index": 18
}
]
Y lo obtengo de la siguiente manera con un provider
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
/*
Generated class for the KpisProvider provider.
See https://angular.io/docs/ts/latest/guide/dependency-injection.html
for more info on providers and Angular DI.
*/
@Injectable()
export class KpisProvider {
private url: string = 'https://private-anon-3cb8931ec8-kpisapi1.apiary-mock.com/api/Projects';
constructor(private http: Http) {
console.log('Hello KpisProvider Provider');
}
getProjects() {
return this.http.get(this.url).map(res => res.json());
}
getUserDetails( projectID ){
return this.http.get(this.url + '/' + projectID).map(res => res.json());
}
}
Y hasta ahorita llevo lo que muestra la siguiente imagen pero falta darle funcionalidad a la search bar