如何从 url 中提取 id？

Question

网址如下所示：

http://localhost:4200/room/RECd4teOsdsro9YRcOMX/chat

我正在尝试提取 id 部分 (RECd4teOsdsro9YRcOMX)

我尝试了以下方法：

chatRoomUid: string;

constructor(
  private route: ActivatedRoute
) {}

ngOnInit() {
  this.chatRoom$ = this.route.parent.parent.params.pipe(
      tap(params => this.chatRoomUid = params.chatRoomUid),
      switchMap(params => {
        if (!params.chatRoomUid) return of(null);
        this.chatRoomUid = params.chatRoomUid;
      })
    );

    console.log(this.chatRoomUid); // returns undefined
}

如何从 url 中提取 id 并将其保存到我的变量 chatRoomUid？

路线：

{ path: 'room/:roomUid', loadChildren: () => import('@chatapp/pages/room/room.module').then(m => m.RoomModule) },

编辑：添加路线

Answer 1

你可以这样定义你的路线

{path: 'room/:chatRoomUid/chat', component: ChatComponent}

然后在你的组件中简单地

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

constructor(private route:ActivatedRoute){}

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

Answer 2

您在不同的环境中console.loging。
请记住 Observables 是异步的，因此您必须将 console.log 移动到 switchMap 中。

但是，只需生成一个新的Observable

chatRoomUid$: Observable<string>;

...

this.chatRoomUid$ = this.route.params.pipe(
  map(params => params['roomUid'])
);