为什么我不能动态确定Angular中loadChildren的字符串？

Question

我有一个问题，我需要动态确定loadChildren的字符串。这是因为当我进行AOT时，根路径必须是'./'，而不是'../'。所以现在我必须在我做AOT之前手动更改它，但我想以编程方式执行此操作。为了实现这一点，我必须能够动态设置loadChildren字符串。

为什么这样简单的事情不起作用？它仍然只是一个字符串：

const loadProfileModule: string = '../profile/profile.module#ProfileModule';

const mainRoutes: Routes = [
    {
        path: '',
        component: MainComponent,
        children: [
            { path: 'profile', loadChildren: loadProfileModule},
        ]
    },
    { path: '**', redirectTo: '/' }
];

我必须为loadChildren显式写入这个值才能使它工作。：

const mainRoutes: Routes = [
    {
        path: '',
        component: MainComponent,
        children: [
            { path: 'profile', loadChildren: '../profile/profile.module#ProfileModule'},
        ]
    },
    { path: '**', redirectTo: '/' }
];

我得到的错误是：

EXCEPTION: Uncaught (in promise): Error: Cannot find module '../profile/profile.module'.
Error: Cannot find module '../profile/profile.module'.
    at webpackEmptyContext (eval at <anonymous> (http://localhost/main.js:2073:1), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (http://localhost/main.js:3155:1), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (http://localhost/main.js:3155:1), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (http://localhost/main.js:849:1), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (http://localhost/main.js:849:1), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (http://localhost/main.js:880:1), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (http://localhost/main.js:880:1), <anonymous>:110:18) [angular]
ErrorHandler.handleError @ VM30272:55
next @ VM30271:374
schedulerFn @ VM30286:100
SafeSubscriber.__tryOrUnsub @ VM30290:236
SafeSubscriber.next @ VM30290:185
Subscriber._next @ VM30290:125
Subscriber.next @ VM30290:89
Subject.next @ VM30287:55
EventEmitter.emit @ VM30286:86
NgZone.triggerError @ VM30285:335
onHandleError @ VM30285:296
ZoneDelegate.handleError @ zone.js?fad3:246
Zone.runGuarded @ zone.js?fad3:129
_loop_1 @ zone.js?fad3:429
drainMicroTaskQueue @ zone.js?fad3:438
VM30272:60 ORIGINAL STACKTRACE:
ErrorHandler.handleError @ VM30272:60
next @ VM30271:374
schedulerFn @ VM30286:100
SafeSubscriber.__tryOrUnsub @ VM30290:236
SafeSubscriber.next @ VM30290:185
Subscriber._next @ VM30290:125
Subscriber.next @ VM30290:89
Subject.next @ VM30287:55
EventEmitter.emit @ VM30286:86
NgZone.triggerError @ VM30285:335
onHandleError @ VM30285:296
ZoneDelegate.handleError @ zone.js?fad3:246
Zone.runGuarded @ zone.js?fad3:129
_loop_1 @ zone.js?fad3:429
drainMicroTaskQueue @ zone.js?fad3:438
VM30272:61 Error: Uncaught (in promise): Error: Cannot find module '../profile/profile.module'.
Error: Cannot find module '../profile/profile.module'.
    at webpackEmptyContext (eval at <anonymous> (main.js:2073), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (main.js:3155), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (main.js:3155), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (main.js:849), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (main.js:849), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (main.js:2255), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (main.js:2255), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (main.js:2255), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (main.js:2255), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (main.js:2255), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (main.js:880), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (main.js:880), <anonymous>:110:18) [angular]
    at resolvePromise (eval at <anonymous> (main.js:5060), <anonymous>:486:31) [angular]
    at eval (eval at <anonymous> (main.js:5060), <anonymous>:523:17) [angular]
    at Object.onInvokeTask (eval at <anonymous> (main.js:1076), <anonymous>:266:37) [angular]
    at ZoneDelegate.invokeTask (eval at <anonymous> (main.js:5060), <anonymous>:274:40) [angular]
    at Zone.runTask (eval at <anonymous> (main.js:5060), <anonymous>:151:47) [<root> => angular]
    at drainMicroTaskQueue (eval at <anonymous> (main.js:5060), <anonymous>:418:35) [<root>]
ErrorHandler.handleError @ VM30272:61
next @ VM30271:374
schedulerFn @ VM30286:100
SafeSubscriber.__tryOrUnsub @ VM30290:236
SafeSubscriber.next @ VM30290:185
Subscriber._next @ VM30290:125
Subscriber.next @ VM30290:89
Subject.next @ VM30287:55
EventEmitter.emit @ VM30286:86
NgZone.triggerError @ VM30285:335
onHandleError @ VM30285:296
ZoneDelegate.handleError @ zone.js?fad3:246
Zone.runGuarded @ zone.js?fad3:129
_loop_1 @ zone.js?fad3:429
drainMicroTaskQueue @ zone.js?fad3:438
zone.js?fad3:405 Unhandled Promise rejection: Cannot find module '../profile/profile.module'. ; Zone: angular ; Task: Promise.then ; Value: Error: Cannot find module '../profile/profile.module'.
    at webpackEmptyContext (eval at <anonymous> (main.js:2073), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (main.js:3155), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (main.js:3155), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (main.js:849), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (main.js:849), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (main.js:2255), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (main.js:2255), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (main.js:2255), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (main.js:2255), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (main.js:2255), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (main.js:880), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (main.js:880), <anonymous>:110:18) [angular] Error: Cannot find module '../profile/profile.module'.
    at webpackEmptyContext (eval at <anonymous> (http://localhost/main.js:2073:1), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (http://localhost/main.js:3155:1), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (http://localhost/main.js:3155:1), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (http://localhost/main.js:849:1), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (http://localhost/main.js:849:1), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (http://localhost/main.js:2255:1), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (http://localhost/main.js:880:1), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (http://localhost/main.js:880:1), <anonymous>:110:18) [angular]
consoleError @ zone.js?fad3:405
_loop_1 @ zone.js?fad3:434
drainMicroTaskQueue @ zone.js?fad3:438
zone.js?fad3:407 Error: Uncaught (in promise): Error: Cannot find module '../profile/profile.module'.
Error: Cannot find module '../profile/profile.module'.
    at webpackEmptyContext (eval at <anonymous> (main.js:2073), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (main.js:3155), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (main.js:3155), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (main.js:849), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (main.js:849), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (main.js:2255), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (main.js:2255), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (main.js:2255), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (main.js:2255), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (main.js:2255), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (main.js:880), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (main.js:880), <anonymous>:110:18) [angular]
    at webpackEmptyContext (eval at <anonymous> (main.js:2073), <anonymous>:2:8) [angular]
    at SystemJsNgModuleLoader.loadAndCompile (eval at <anonymous> (main.js:3155), <anonymous>:75:40) [angular]
    at SystemJsNgModuleLoader.load (eval at <anonymous> (main.js:3155), <anonymous>:63:60) [angular]
    at RouterConfigLoader.loadModuleFactory (eval at <anonymous> (main.js:849), <anonymous>:84:128) [angular]
    at RouterConfigLoader.load (eval at <anonymous> (main.js:849), <anonymous>:71:81) [angular]
    at eval (eval at <anonymous> (main.js:2255), <anonymous>:175:56) [angular]
    at PreloadAllModules.preload (eval at <anonymous> (main.js:2255), <anonymous>:77:81) [angular]
    at RouterPreloader.preloadConfig (eval at <anonymous> (main.js:2255), <anonymous>:174:40) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:159:31) [angular]
    at RouterPreloader.processRoutes (eval at <anonymous> (main.js:2255), <anonymous>:162:31) [angular]
    at RouterPreloader.preload (eval at <anonymous> (main.js:2255), <anonymous>:139:67) [angular]
    at MergeMapSubscriber.eval [as project] (eval at <anonymous> (main.js:2255), <anonymous>:134:141) [angular]
    at MergeMapSubscriber._tryNext (eval at <anonymous> (main.js:880), <anonymous>:120:27) [angular]
    at MergeMapSubscriber._next (eval at <anonymous> (main.js:880), <anonymous>:110:18) [angular]
    at resolvePromise (eval at <anonymous> (main.js:5060), <anonymous>:486:31) [angular]
    at eval (eval at <anonymous> (main.js:5060), <anonymous>:523:17) [angular]
    at Object.onInvokeTask (eval at <anonymous> (main.js:1076), <anonymous>:266:37) [angular]
    at ZoneDelegate.invokeTask (eval at <anonymous> (main.js:5060), <anonymous>:274:40) [angular]
    at Zone.runTask (eval at <anonymous> (main.js:5060), <anonymous>:151:47) [<root> => angular]
    at drainMicroTaskQueue (eval at <anonymous> (main.js:5060), <anonymous>:418:35) [<root>]