Skip to content

Commit 7e35a91

Browse files
IvnosingAndrewKushnir
authored andcommitted
fix(router): add error message when using loadComponent with a NgModule (angular#49164)
Add a more specific error message when defining a lazy-loaded route using `loadComponent` and passing it a NgModule instead of a standalone component, when the user should actually be using `loadChildren`. PR Close angular#49164
1 parent 3c079a7 commit 7e35a91

File tree

3 files changed

+28
-2
lines changed

3 files changed

+28
-2
lines changed

packages/core/src/core_render3_private_export.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -248,6 +248,9 @@ export {
248248
export {
249249
compilePipe as ɵcompilePipe,
250250
} from './render3/jit/pipe';
251+
export {
252+
isNgModule as ɵisNgModule
253+
} from './render3/jit/util';
251254
export { Profiler as ɵProfiler, ProfilerEvent as ɵProfilerEvent } from './render3/profiler';
252255
export {
253256
publishDefaultGlobalUtils as ɵpublishDefaultGlobalUtils

packages/router/src/utils/config.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
* found in the LICENSE file at https://angular.io/license
77
*/
88

9-
import {createEnvironmentInjector, EnvironmentInjector, isStandalone, Type, ɵRuntimeError as RuntimeError} from '@angular/core';
9+
import {createEnvironmentInjector, EnvironmentInjector, isStandalone, Type, ɵisNgModule as isNgModule, ɵRuntimeError as RuntimeError} from '@angular/core';
1010

1111
import {EmptyOutletComponent} from '../components/empty_outlet';
1212
import {RuntimeErrorCode} from '../errors';
@@ -57,7 +57,13 @@ export function validateConfig(
5757
}
5858

5959
export function assertStandalone(fullPath: string, component: Type<unknown>|undefined) {
60-
if (component && !isStandalone(component)) {
60+
if (component && isNgModule(component)) {
61+
throw new RuntimeError(
62+
RuntimeErrorCode.INVALID_ROUTE_CONFIG,
63+
`Invalid configuration of route '${
64+
fullPath}'. You are using 'loadComponent' with a module, ` +
65+
`but it must be used with standalone components. Use 'loadChildren' instead.`);
66+
} else if (component && !isStandalone(component)) {
6167
throw new RuntimeError(
6268
RuntimeErrorCode.INVALID_ROUTE_CONFIG,
6369
`Invalid configuration of route '${fullPath}'. The component must be standalone.`);

packages/router/test/standalone.spec.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -337,6 +337,23 @@ describe('standalone in Router API', () => {
337337
TestBed.inject(Router).navigateByUrl('/home');
338338
expect(() => advance(root)).toThrowError(/.*home.*component must be standalone/);
339339
}));
340+
341+
it('throws error when loadComponent is used with a module', fakeAsync(() => {
342+
@NgModule()
343+
class LazyModule {
344+
}
345+
346+
TestBed.configureTestingModule({
347+
imports: [RouterTestingModule.withRoutes([{
348+
path: 'home',
349+
loadComponent: () => LazyModule,
350+
}])],
351+
});
352+
353+
const root = TestBed.createComponent(RootCmp);
354+
TestBed.inject(Router).navigateByUrl('/home');
355+
expect(() => advance(root)).toThrowError(/.*home.*Use 'loadChildren' instead/);
356+
}));
340357
});
341358
describe('default export unwrapping', () => {
342359
it('should work for loadComponent', async () => {

0 commit comments

Comments
 (0)