Angular Ionic：加载具有不同参数的相同页面

我有一个页面，其中有一个文本输入字段和一个按钮。在文本输入中输入数据并单击搜索后，将使用输入文本进行Api调用，结果显示在按钮下方，这是我的代码

模板

<ion-input type="text" [(ngModel)]="location"></ion-input>
<button (click)="onSearch()">Search</button>
<ion-list>
//display search results here
</ion-list>

用户还可以更改输入和搜索中的数据。这是可行的，但当用户搜索两次或更多次并点击“后退”按钮时，他将被导航回主页，而不是上一次搜索

是否有办法通过传递输入数据，在每次单击搜索按钮时将同一页面（“此处为SearchPage”）推送到navControl？这样“后退”按钮就可以按预期工作了

这些变化对我起了作用 组件中

OnInit() {
    location=this.navParams.get('data');
    //Api call using location fetched from navParams
}
onSearch(){
    this.navController.push(SearchPage,{data:this.location})
}

---

根据你的评论，我觉得你走错了路。你可以轻松地使用你的应用程序

根据上面的文档，您可以按如下所示进行操作

.html

---

根据你的评论，我觉得你走错了路。你可以轻松地使用你的应用程序

根据上面的文档，您可以按如下所示进行操作

.html

---

你能显示你的

页面的
代码
导航

吗，包括

后退

按钮功能等？我试着调用“navController.push（同一页面）”，它按照我的要求工作。（为问题添加了代码）。。。但是一次又一次地推同一页可以吗？@sampath这对我来说不清楚。你能澄清一下吗<代码>这是可行的，但当用户搜索两次或更多次并点击“后退”按钮时，他将被导航回主页，而不是上一次搜索。例如，用户首先搜索“班加罗尔”，然后将输入更改为“孟买”并进行搜索。。现在，如果他按下后退键，我想为他显示结果Bangalore@SampathOK，那么你能显示

后退

按钮的代码吗？你能显示

页面的
代码
导航

包括

后退

按钮功能等吗？我试着调用了“导航控制器.按下（同一页）”，结果一切正常。（在问题中添加了代码）…但可以一次又一次地推同一页吗？@sampath我不清楚。你能进一步澄清吗？

这是可行的，但当用户搜索两次或更多次并点击“后退”按钮时，他将被导航回主页，而不是上一次搜索。

例如，用户搜索“班加罗尔”第一次和第二次，他将输入改为“孟买”并进行搜索。现在，如果他按下后退键，我想显示搜索结果Bangalore@SampathOK，那么您能显示

back

按钮的代码吗？

OnInit() {
    location=this.navParams.get('data');
    //Api call using location fetched from navParams
}
onSearch(){
    this.navController.push(SearchPage,{data:this.location})
}

<ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>
<ion-list>
  <ion-item *ngFor="let item of items">
    {{ item }}
  </ion-item>
</ion-list>

@Component({
  templateUrl: 'search/template.html',
})
class SearchPage {

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

  constructor() {
    this.initializeItems();
  }

  initializeItems() {
    this.items = [
      'Amsterdam',
      'Bogota',
      ...
    ];
  }

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

    // set val to the value of the searchbar
    let 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);
      })
    }
  }
}