Фильтрация массива в угловом 2 машинописных текста

Question

Я изучаю, как фильтровать массив с данными в Angular 2 с машинописным текстом. Фильтрация предназначена для поисковой панели в Ionic 2, список в шаблоне получает данные и отображается, но фильтрация не будет работать.

initializeItems(i:number) { 
this.http.get('https://maps.googleapis.com/maps/api/place/details/json?placeid='+this.placeid+'&key=AIzaSyBPi-ayuvkTht4wddCcvcy0l2wIBdT9P2w').map(res => res.json()).subscribe(data => { 
    this.locations[i]._detail = data.result; 

    this.names.push([ 
    { 
     name: this.locations[i]._detail.name, 
     adress: this.locations[i]._detail.formatted_address, 
     phone: this.locations[i]._detail.formatted_phone_number 
    } 
    ]); 

    this.items = this.names; 
    console.log(this.items); 
}); 
} 

getItems(ev) { 
    this.items = this.names; 
    console.log(this.items); 
    // set val to the value of the ev target 
    var val = ev.target.value; 

    // if the value is an empty string don't filter the items 
    if (val && val.trim() != '') { 
    this.items = this.items.filter((item) => { 
     return (item.name.toLowerCase().indexOf(val.toLowerCase()) > -1); 
    }) 
    } 
} 

---

Когда я типа в SearchBar я получаю эту ошибку.

Answer 1

Я думаю, что вы подаете push неправильно. Нажимаем объект в массив, а не на другой массив. Если у вас есть несколько имен использовать spread оператор

this.names.push(
    { 
     name: this.locations[i]._detail.name, 
     adress: this.locations[i]._detail.formatted_address, 
     phone: this.locations[i]._detail.formatted_phone_number 
    } 
); 

Answer 2

Я нашел решение.

1. Изменены ключи в строки в объекте
2. добавил [0] в ответном заявлении
3. Измененный массив orginames и установить элементы = orginames, это гарантирует, что массив не будет пустым, если вам поиск и удаление слова снова.

---

initializeItems(i:number) { 
this.http.get('https://maps.googleapis.com/maps/api/place/details/json?placeid='+this.placeid+'&key=AIzaSyBPi-ayuvkTht4wddCcvcy0l2wIBdT9P2w').map(res => res.json()).subscribe(data => { 
    this.locations[i]._detail = data.result; 


    this.orginames.push([ 
    { 
     "name": this.locations[i]._detail.name, 
     "adress": this.locations[i]._detail.formatted_address, 
     "phone": this.locations[i]._detail.formatted_phone_number 
    } 
    ]); 

    this.items = this.orginames; 
    // this.orginames.push(this.locations[i]._detail.name); 

}); 
console.log(this.items); 

} 

getItems(ev) { 
    this.items = this.orginames; 
    //console.log(this.items); 
    // set val to the value of the ev target 
    var val = ev.target.value; 

    // if the value is an empty string don't filter the items 
    if (val && val.trim() != '') { 
    this.items = this.items.filter((item) => { 
     return (item[0].name.toLowerCase().indexOf(val.toLowerCase()) > -1); 
    }) 
    } 
}