使用 Angular 匹配器进行路由抛出 "Consider changing the function expression into an exported function"

Question

我想知道你们是否可以帮助这个代码！因为我觉得我快疯了

这是\helpers\matcher.ts(4,12):

import { UrlMatcher , UrlSegment } from "@angular/router";

export function match(path: string): UrlMatcher {
    return function matcher(url: UrlSegment[], group) {
        console.log(path, url, group);
        if (url.length > 0 && url[0].path === path) {
            return { consumed: [url[0]] };
        }
        return null;
    };
}

这是我在执行 ng build --prod

时遇到的错误

ERROR in src\app\app.module.ts(124,30): Error during template compile of 'AppModule'

Function expressions are not supported in decorators in 'rootRouterConfig'
'rootRouterConfig' references 'match'
'match' contains the error at src\app\shared\helpers\matcher.ts(4,12)
Consider changing the function expression into an exported function

但它可以编译并与 ng build 和 ng serve 完美配合。

这是app.routes路径

export const rootRouterConfig: Routes = [

    { path: ':param', component: HomeComponent,
        children: [
            { matcher: match('job-spec/:id'), component: JobSpecDetailsComponent },
            { path: '**',  redirectTo: '404' },
        ]
    },
];

这是 app.module

@NgModule({
    imports: [
        ....
        RouterModule.forRoot(rootRouterConfig, {
            useHash: false,
            scrollPositionRestoration: 'enabled',
            anchorScrolling: 'enabled',
        }),
        ....

Answer 1

我无法测试它，但请尝试以下操作：

export function match(url: UrlSegment[]): UrlMatcher {
    if (url.length > 0 && url[0].path === path) {
       return { consumed: [url[0]] };
    }
    return null;
}

并将其用作：

{ matcher: match, component: JobSpecDetailsComponent },

URL 有路径，但不确定你需要为什么要再次传递路径。静态使用路径，看看它是否编译，然后找出你的路径。

使用 Angular 匹配器进行路由抛出 "Consider changing the function expression into an exported function"

Using Angular matcher for route throws "Consider changing the function expression into an exported function"

routing

matcher

angular