如何在使用混合路由时以角度使用 ActivatedRoute？

Posted 2023-02-19

【中文标题】如何在使用混合路由时以角度使用 ActivatedRoute？

【英文标题】：How to use ActivatedRoute in angular while using Hybrid routing?

【发布时间】：2019-10-07 04:21:53

【问题描述】：

我正在尝试从使用升级模块的混合应用程序的角度组件中的路由（/item/id:[^/]*/'）获取数据

我尝试了 ActivatedRoute 来延迟路由器状态，但它一直抱怨路由配置无效。

AppModule

const itemState = 
    name: 'item',
    url: '/details/item:id:[^/]*/',
    title: 'Item detail',
    component: ItemContainerComponent
;
@NgModule(
    entryComponents: [],
    declarations: [],
    imports: [
        BrowserModule,
        RouterModule.forRoot([]),
        UpgradeModule,
        UIRouterUpgradeModule.forRoot( states: [itemState] ),
    ],
    providers: [
         provide: LocationStrategy, useClass: HashLocationStrategy 
    ]
)


ItemContainerComponent

ngOnInit() 
  this.route.params.subscribe(params => 
    console.log(params['id']);
  );

路由''配置无效：路由必须指定路径或匹配器；区域：;任务：Promise.then；值：错误：路由''的配置无效：路由必须指定路径或匹配器

【参考方案1】：

似乎解决方案是使用“@uirouter/core”中的transition 并执行以下操作。

constructor(private transition: Transition) 

ngOnInit() 
  this.itemId = this.transition.params().id;