Angular - 使用查询参数从另一个组件重定向后重新加载/更新组件数据

如何解决Angular - 使用查询参数从另一个组件重定向后重新加载/更新组件数据

我正在处理 2 个组件。 MyNotesComponent 和 CoursetoolsComponent。

在 CoursetoolsComponent 中，我添加了一个新笔记并显示最近的笔记，如下所示。

当我点击任何注释时（如图“注释 1、注释 2 或注释 3”所示）。我在 CoursetoolsComponent 中点击笔记有以下功能。

directToNote(id){
     this.router.navigate(['/student/my-notes'],{queryParams: {"notes": id}})
    }

这会将我引导至 /student/my-notes?notes=1

问题： 如果我直接打开 MyNotesComponent，它会正确显示获取的笔记数据。查看该数据后，我转到 CoursetoolsComponent 以添加新注释并单击新添加的注释它会将我重定向到 MyNotesComponent 页面，但数据未在 MyNotesComponent 上更新添加了最新的注释。 如果我刷新页面，则会更新并显示数据。每次导航到 MyNotesComponent 时如何刷新数据？

MyNotesComponent.ts

 ngOnInit(){
  this.fetchNotes();
}
 //Get All Notes 
  fetchNotes(){
    this.courseApi.coursesCourseNotesNotesList().subscribe(
      (data: any) => {
        this.notesSaved = data;
      },(err) => { console.error(err); },() => { }
    )
  }

我尝试过的事情： - 将 routeReuseStrategy 添加到 CoursetoolsComponent 中的路由导航：

 directToNote(id){
            this.router.routeReuseStrategy.shouldReuseRoute = function () {
              return false;
          }
           this.router.navigate(['/student/my-notes'],{queryParams: {"notes": id}})
          }

不起作用。还将 routeReuseStrategy 添加到 MyNotesComponent 的构造函数中，它根本不起作用。