首页 > 解决方案 > 当路由在 Angular 组件中没有解析器时的处理

问题描述

我有一个详细组件,用于创建新组件和更新组件。我在 'edit/:id' 路由上使用了解析器。我没有在“新”路线上使用解析器。

  ngOnInit() {
    if (!(this.route.snapshot.url[0].path === '/new')) {
      this.route.data
      .subscribe((data: { project: Project}) => {
        this.project= data.project;
      });
    }
  }

这是我能够获得的网址。一个似乎是完整路径,另一个似乎只是路径的最后一部分。

this.route.snapshot.url[0].path
// Ends up being: 'new'

this.router.url
// Ends up being '/admin/projects/new'

我试图弄清楚是否有更好的技术来确定何时加载解析器数据以及何时不加载。我是否使用网址朝着正确的方向前进?如果是这样,您会推荐哪个 url 变量?

标签: angulartypescriptangular-routingangular-router

解决方案


您可以使用路线数据来确定您是添加新项目还是编辑现有项目。

在您的路由器中:

{path: 'admin/projects/:id', component: YourComponent, data: {type: 'edit'}},

在您的组件中:

ngOnInit(): void {
    if (this.route.snapshot.data['type'] === 'edit') {
        this.route.data.subscribe((data: { project: Project}) => {
            this.project = data.project;
        });
    }
}

我不能说这种方法比使用 URL 来识别它是否是编辑更好,但是如果您愿意,可以使用它。


推荐阅读