Question

不是像我这样构建我的组件的网址mysite.com/map/3,7，而是想像{{1}}那样构建它，并且能够将第一个值检索为＆＃34; row＆＃34;第二个是＆＃34; cell＆＃34;。

我将如何实现这一目标？

PS：如果可能，我还需要知道如何让Express了解这一点，以便我的Universal应用程序能够正确呈现它。

Answer 1

如果我需要这样做，我可能会遵循下一个模式：

定义路线：

{ path: 'map/cell/:rowColumn', component: MyComponent }

<强> component.ts

constructor(private route: ActivatedRoute) {}

ngOnInit() {
    this.route.params.subscribe(
            params => {
                const paramsArray = params.rowColumn.split(',');
                const row = paramsArray[0];
                const cell = paramsArray[1];
            }
        );
}

Answer 2

答案很简单。在路线的定义中，您应该定义matcher而不是url。

export const MyRouteMatcher = segments: UrlSegment[], segmentGroup: UrlSegmentGroup, route: Route): UrlMatchResult {
  // 1: Check it matches your pattern, if not then return null
  const parameterValues: { [key: string]: UrlSegment } = {};
  parameterValues['row'] = new UrlSegment(valueForRow, null);
  parameterValues['cell'] = new UrlSegment(valueForCell, null);

  return {
    consumed: segments,
    posParams: parameterValues
  }
}

匹配Angular Router中的特定模式

2 个答案: