Question

我有一个页面/news，其参数为page。例如：/news;page=2。页面更改后，我不想重新初始化新闻页面。我只想订阅页面更改，我已经尝试了以下代码：

export class NewsPage implements OnInit {
    constructor(private route: ActivatedRoute) {
    }

    ngOnInit() {
        this.route.params.subscribe(params => {
            ...
        });
    }
}

如果/news页已打开，而我使用不同的页面参数（/news导航到this.router.navigate(['/news', {page: 2} ])页，则该页将重新初始化（该页将被破坏并再次创建）。

但是，如果我使用queryParams（/news?page=2）而不是params（/news;page=2），则一切正常：

export class NewsPage implements OnInit {
    constructor() {
    }

    ngOnInit() {
        this.route.queryParams.subscribe(params => {
            ...
        });
    }
}

如果我呼叫this.router.navigate(['/news'], {queryParams: {page: 2}} )，则该页面不会重新初始化。只是执行订阅回调。为什么会发生？

这是我的路由文件：

const routes: Routes = [
  { path: "", redirectTo: "/home", pathMatch: "full" },
  {
    path: "news",
    loadChildren: "./pages/news/news.module#NewsPageModule"
  }
  { path: "**", redirectTo: "/page404" }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {}

这是我的新闻页面模块：

const routes: Routes = [
  {
    path: "",
    component: NewsPage
  }
];
@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes),
    SharedModule
  ],
  declarations: [NewsPage]
})
export class NewsPageModule {}

Answer 1

更新您的导航功能调用：）

 this.router.navigate(['/news'], { queryParams: { page: 2 } });

然后

export class NewsPage implements OnInit {
    constructor(private route: ActivatedRoute) {
    }

    ngOnInit() {
        this.route.queryParams.subscribe(params => {
            ...
        });
    }
}

Answer 2

订阅路由参数已被弃用，现在您可以访问以下内容

this.id = this.route.snapshot.params.id;

订阅路由参数无效

2 个答案: