Angular @角度/路由器：未检索路由数据

我有以下角度记录组件：

注意：此角度项目是使用JHipster生成的。为了构建我的记录组件，我受到了已生成的记录实体代码的启发。顺便说一下，我使用这个文件夹中已经存在的记录服务从后端获取一个记录实体

在我的html中，我想在表中显示记录对象的一些属性

我希望这张桌子有几页。我在我的

records.component.ts

中实现的代码中工作不正常的部分如下：

ngOnInit(): void {
    this.handleNavigation();
    this.registerChangeInRecords();
}

protected handleNavigation(): void {
    combineLatest(this.activatedRoute.data, this.activatedRoute.queryParamMap, (data: Data, params: ParamMap) => {
      const page = params.get('page');
      const pageNumber = page !== null ? +page : 1;
      const sort = (params.get('sort') ?? data['defaultSort']).split(','); //error here
      const predicate = sort[0];
      const ascending = sort[1] === 'asc';
      if (pageNumber !== this.page || predicate !== this.predicate || ascending !== this.ascending) {
        this.predicate = predicate;
        this.ascending = ascending;
        this.loadPage(pageNumber, true);
      }
    }).subscribe();
  }

activatedRoute

是

@angular/router

库中的

activatedRoute

对象

当我第一次加载页面时，URL中没有参数，因此应该考虑默认参数。问题在于

此.activatedRoute.data

为空：

然后，我有以下错误：

此数据对象应包含以下属性（如记录实体页面）：

这些属性在

记录.route.ts

中设置：

这个常数在my

记录中声明。module.ts

：

---

我不明白我错过了什么。任何帮助都将不胜感激。

我查看了您的源代码，发现一些结构问题正在纠正，我能够解决错误

您在路由中未使用冲突解决程序。关键信息将解决您的可观察问题

{
 path: '',
 resolve:{message : RecordsResolve},
 component: RecordsComponent,
 data: {
 authorities: [Authority.USER],
 defaultSort: 'id,asc',
 pageTitle: 'records.title',
}

您在records-routing.module.ts中使用了不同的路由

以前

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

之后

若使用单独的路由文件，则无需在模块文件中定义子路由。以前的记录模块

@NgModule({
declarations: [RecordsComponent],
imports: [DigicliSharedModule, RecordsRoutingModule, 
 RouterModule.forChild(recordsRoute)],
})

之后

---

最后，您可以通过删除未使用的导入来清理代码。

您可以粘贴完整的（导入和构造函数）组件吗？或者制作一个codesandbox，在组件中没有初始化ActivatedRoute似乎是一个问题，但在查看组件之前，我不能肯定这一点您的代码需要重构。要我解释一下吗你好，谢谢你的回答。我做了更改，但我仍然有错误，我不明白我请求访问您的回购协议，您可能必须批准它@mailmeonarpitOk我看到了我丢失的内容，谢谢您的帮助！所以如果我总结我的错误：我把代码放错了文件。我把它放在模块文件（records.module.ts）中，而我有一个单独的路由文件（records routing.module.ts）。

@NgModule({
declarations: [RecordsComponent],
imports: [DigicliSharedModule, RecordsRoutingModule, 
 RouterModule.forChild(recordsRoute)],
})

@NgModule({
 declarations: [RecordsComponent],
 imports: [DigicliSharedModule, RecordsRoutingModule],
})