选择异步管道下的项目

时间:2016-11-20 11:11:37

标签: angular typescript ionic2 rxjs

我有一个简单的搜索组件,它是真实组件的基本实现。

想法是<ion-list>包含更复杂的条目(对象),我想通过点击<ion-item>来从此列表中选择项目。

@Component({
  template: `
    <ion-searchbar [formControl]="searchControl">
    </ion-searchbar>
    <ion-list>
      <ion-item 
        *ngFor="let entry of entries | async; let entryIndex = index;"
        (click)="selectItem(entryIndex)">
        {{ entry.title }} - {{ entry.description }}
      </ion-item>
    </ion-list>`
})
export class SearchPage {
  public searchControl: FormControl;
  public entries: Observable<Array<any>>;

  constructor(private search: Search) {
    this.searchControl = new FormControl();
  }

  ionViewDidLoad() {
    this.entries = this.searchControl
      .valueChanges
      .debounceTime(500)
      .distinctUntilChanged()
      .switchMap(query => this.search.byKeyword(query));
  }

  selectItem(entryIndex: number) {
     // ...
  }

}

问题是如何通过索引从可观察数组条目中选择项目?

如果我尝试这样的话:

selectItem(entryIndex: number) {
  this.entries
    .map((entries: any[]) => entries[entryIndex])
    .subscribe(data => console.info("Selected entry", data));
}

我什么也没得到(逻辑上是这样)

0 个答案:

没有答案