0

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

我尝试了什么: 我在 APP_INITIALIZER 上调用 API 并将其保存在 localStorage 上,问题是我有没有 localStorage 的 Angular Universal,也无法将任何服务注入到 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 请求。如果使用角度防护,也跳到下一条路线检查。

4

1 回答 1

0

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

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

export function linuxMatcher(url: UrlSegment[]) {
  if (environment.linux) {
    return url.length === 1 && url[0].path.endsWith('firewall') ? { consumed: url } : null;
  }
  return null;
}
于 2019-07-22T20:25:03.820 回答