使用后退按钮后结果数组仍然存在

Question

我有一个搜索栏 ion-searchbar，当我搜索时，我将结果存储在一个 promise 数组中。我面临的问题是当我搜索然后使用后退按钮时——我的结果保留在之前搜索的数组中。

清空我的数组的唯一方法是重新加载整页，否则数组将继续附加结果而不是清空它。

Initial results page

Hitting back button and searching again

从我的搜索服务中 returns 一个承诺对象数组：Promise<GetSearchResults[]>

我的 GetSearchResults 对象看起来像这样：

export interface GetSearchResults {
  title: string;
  id: string;
}

在我的 Search Page 我有：

export class SearchPage implements OnInit {
  query: string;
  results: Promise<GetSearchResults[]>;

  constructor(
    private route: ActivatedRoute,
    private search: SearchQueryService
  ) {}

  ngOnInit() {
    this.route.paramMap.subscribe(async (params) => {
      this.query = params.get('query');

      console.log('Params -> ' + JSON.stringify(params));
      if (this.query != null) {
        console.log('Query => ' + this.query);
        this.results = this.search.searchPages(this.query);
      }
    });
  }
}

我面临的问题是每个路由器导航到我的搜索页面： this.router.navigate(['/search', this.query]);

搜索页面的数组不会以空结果数组开头（如果之前已设置）。

this.results = this.search.searchPages(this.query); <- 除非页面完全重新加载，否则此数组不断附加结果并且不为空

Answer 1

只需删除 ionViewDidLeave 或 ionViewWillEnter 上的结果阅读有关 Ionic 页面事件的更多信息 here

使用后退按钮后结果数组仍然存在

Result array persists after using back button

ionic-framework

angular