Question

我刚刚创建了一个包含多个项目的搜索栏，但我希望每个项目都重定向到特定页面，但我不知道如何操作（搜索后无结果）。这是我的代码

html：

<ion-header>

  <ion-navbar>
      <button ion-button menuToggle>
          <ion-icon name="menu"></ion-icon>
        </button>
    <ion-title>wiki</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <ion-searchbar (ionInput)="getItems($event)" ></ion-searchbar>
  <ion-list>
    <ion-item *ngFor="let item of items">
    <button ion-button color="dark" clear (click)="itemSelected(tem)">{{ item }}</button>
    </ion-item>
  </ion-list>
</ion-content>

TypeScript：

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { HomePage } from '../home/home';


@IonicPage()
@Component({
  selector: 'page-wiki',
  templateUrl: 'wiki.html',
})
export class WikiPage {

  searchQuery: string = '';
  items: string[];

  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.initializeItems();
  }

  itemSelected(item){
    this.navCtrl.push(HomePage);
  }


  initializeItems() {
    this.items = [
      'MSI GTX 1050 GAMING X 2Go',
      'Test'
    ];
  }

  getItems(ev: any) {
    // Reset items back to all of the items
    this.initializeItems();

    // set val to the value of the searchbar
    const 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.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }
  }
}

感谢您的帮助。

Stack Overflow希望我添加更多帖子细节，但我不知道如何...

如何在离子搜索栏中为每个按钮分配页面

0 个答案: