时间戳

首页 > 解决方案 > 启用 AoT 时，ActivatedRoute.snapshot 中的 Angular 路由“数据”为空

angular - 启用 AoT 时，ActivatedRoute.snapshot 中的 Angular 路由“数据”为空

问题描述

我的 Angular 7 应用程序中有一些路由具有data用于不同目的的属性 - 从activatedRoute.snapshot.data. 我遇到的问题是在开发（JIT 编译器）中一切都按预期工作，但是一旦我使用 Ahead-of-time 进入生产环境，它data就是一个空对象。

重现的最低限度：data向路线添加属性，例如

在app-routing.module.ts：

...
const routes: Routes = [
    {
        path: 'foo',
        component: fooComponent,
        data: {
            bar: 'bar'
        }
    }
];
...

然后console.log()在activatedRoute.snapshot.data与路由匹配的组件中，例如

在foo.component.ts：

...
import { ActivatedRoute } from '@angular/router';
...

constructor(
    private activatedRoute: ActivatedRoute
) { }

ngOnInit() {
    console.log(this.activatedRoute.snapshot.data);
}

使用ng serve(JIT)，您应该获得datain 控制台。With ng serve --aot=true(Ahead-of-time)data是控制台中的一个空对象。

除了在生产中禁用 AoT 之外，我没有什么可以尝试的，由于性能优势，这并不理想。它看起来像是 AoT 本身的问题，但在这里我想知道其他人是否曾经面临并解决过同样的问题？

标签： angularangular-routerangular-aot

解决方案

似乎是这个问题：https ://github.com/angular/angular-cli/issues/5754

快速解决方案：

// app.component.ts
constructor(private router: Router) {
  // reset routes
  router.resetConfig(routes);
}

推荐阅读