Angular 8 如何使用来自 NavigationExtras 的不同状态的相同路线？

Question

我正在使用 Angular 8 和 Ionic 4。我有一个 activity 的路由，用于创建（POST）或编辑（PUT）基于onEditMode NavigationExtras 中提供的参数 state。

然而，在第二次访问该路线后，它显示旧的过时数据 - 也许 Angular 保留重新加载，但我想改变它像 Ionic 3 导航一样工作 - 在每次页面更改时重新加载.

我希望有一个选项可以删除导航堆栈的 activities:name 页面，这样我就可以使用新参数导航到该页面并根据该参数更新页面视图。

应用路由模块


{
    path: 'activities/:name',
    loadChildren: () =>
      import('./pages/activities/activities-routing.module').then(m => m.ActivitiesRoutingModule)
  }

以及导航功能

let navigationExtras: NavigationExtras = {
      state: {
        date: this.reportDate,
        href: this.getCurrentUrlWithoutTabs(this.router.url),
        report: data,
        editMode: true,
        reportData: report,
        previewMode: preview
      },
      replaceUrl: true,
      skipLocationChange: true
    };
    let backHref = 'daily-overview'
    this.router.navigateByUrl(`/tabs/activities/${pageUrl}`, navigationExtras)
    .then(() => this.router.navigate([`/tabs/activities/${pageUrl}`]))

要点 => 应用程序-routing.module.ts https://gist.github.com/Verthon/a9432a502329e6d30b05b1d9db53d9dc

要点 => activity.page.ts https://gist.github.com/Verthon/59a107552b997f517e910b6fa83c03cd

要点 => gotToAcitivity() https://gist.github.com/Verthon/537fe2fb407997aa7e45fa7cb49467bb

Answer 1

在 ionic 中，每当你去新路线时，它正在构建，当你离开它时它会被销毁，所以你的问题是 navigationextras，它们仍然绑定以前的值并且在导航回来后不会被清除，因此，要么在后退导航中清除导航参数，要么创建一个服务以在导航中设置其中的对象，并在导航中使用 get 路由 return 它，并且当路由视图离开时清除服务...

而且我确定有些地方不正确，但是因为我没有两个页面的完整代码，所以你需要做的就是当第二个页面视图离开时，清除页面中的所有变量，比如:

ionViewWillLeave() {
   firstvariable = [] ; 
   second variable =0 ;
   third variable = '';
   ...
}

并且所有页面都应该在每个条目上强制重新填充，但如果您需要一个准确和好的解决方案，您需要提供 2 个页面的代码。

Angular 8 如何使用来自 NavigationExtras 的不同状态的相同路线？

Angular 8 how to use same route with different state from NavigationExtras?

angular

ionic4

angular2-routing

angular-router