如何在Angular 7 route的matcher函数中进行API调用

Question

我在Angular 7中有一个路由匹配器函数，需要进行API调用来获取数组并检查该数组是否包含URL slug

我尝试过：我在APP_INITIALIZER上调用API并将其保存在localStorage上，问题是我有Angular Universal没有localStorage，也无法将任何服务注入到typescript类之外的函数中以使用CookieService或HttpClient服务。 尝试使用Angular防护，但不知道如何跳转到路由配置数组中的下一个对象，以防在类别数组中找不到URL。

我现在拥有的：

export function DealsMatcher(url: UrlSegment[]): UrlMatchResult {

    if (url.length === 0) {
        return null;
    }
    let categories: HeaderCategoriesModel[];
    // TODO: need to get categories from API
    const param = url[0].toString();
    const index = categories.findIndex(category => {
        return category.title_translit === param;
    });

    if (index !== -1) {
        return ({consumed: url, posParams: {slug: url[0]}});
    }

    return null;

}

const routes: Routes = [
    {
        path: ':slug',
        matcher: DealsMatcher,
        component: DealsComponent,
    },
    {
        path: ':slug',
        matcher: DealsDetailMatcher,
        component: DealsDetailComponent,
        resolve: {
            deal: DealsDetailResolve
        }
    }
]

我希望以某种方式将服务注入到函数DealsMatcher中或者在不注入的情况下执行ajax请求。 如果使用角度防护，也跳到下一个路线检查。

Answer 1

在启动应用程序时，我正在更改环境中变量的值，并且我在匹配器函数中使用此变量。

我从未使用过Universal Angular，我不知道这样做是否会有任何问题

export function linuxMatcher(url: UrlSegment[]) {
  if (environment.linux) {
    return url.length === 1 && url[0].path.endsWith('firewall') ? { consumed: url } : null;
  }
  return null;
}