Как найти / отфильтровать наблюдаемый массив строк типа?
Например, у меня есть следующие наблюдаемые
names$ = Observable.of(['Lenovo','Dell','Toshiba','Apple','Microsoft']);
Теперь я хотел бы отфильтровать это наблюдаемое в зависимости от того, какие типы пользователей вводятся в текстовое поле ввода.
Итак, у меня есть следующий код, и я хотел бы вернуть отфильтрованное наблюдаемое на основе searchTerm пользователя, введенного в поле ввода.
Обратите внимание, что я ищу решение на стороне клиента. У меня уже есть данные на стороне клиента, и по какой-то причине я не могу отправить поисковый запрос на сервер для фильтрации данных. Я также понимаю, что в этом примере я могу напрямую использовать фильтр для самого массива, но я хочу сделать это с помощью наблюдаемого.
Я также пробовал сглаживать массив с помощью оператора плоской карты, но все еще не смог вернуть наблюдаемое в конце, которое должно иметь тип строкового массива.
Любая помощь будет оценена. Заранее спасибо.
App.component.html
<!-- Textbox to receive user input -->
Search:<input type='text' [(ngModel)]='searchTerm' (keypress)='onkeypress($event.target.value)'>
<p>Search Term: {{searchTerm}}</p>
<hr>
<!-- Show search results here as ordered list -->
<ng-container *ngIf='(names$|async)?.length>0'>
<ol>
<li *ngFor='let name of names$|async'>
{{name}}
</li>
</ol>
</ng-container>
App.component.ts
import {Component, OnInit} from '@angular/core';
import {Observable} from 'rxjs';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
names$: Observable<string[]>;
filteredNames$: Observable<string[]>;
searchTerm: string;
ngOnInit() {
this.names$ = Observable.of(['Lenovo', 'Dell', 'Toshiba', 'Apple', 'Microsoft']);
}
// HOW TO IMPLEMENT THIS FUNCTION ??
onkeypress(value) {
console.log(value);
this.names$ = this.names$.map(names => names.indexOf(value) > 0)
// .filter(x=>{console.log(x.indexOf(value));return x.indexOf(value)>0})
// .subscribe(
// (data)=>console.log(data), (error)=>console.log('Error'+error),
// ()=>console.log('complete'));
}
}