ionic-team/ionic-framework · error · Error
Outlet is not activated
Error message
Outlet is not activated
What it means
Thrown by the `component` getter on IonRouterOutlet when accessed before any route has been activated in that outlet. The getter returns this.activated.instance, but if this.activated is null there is no component instance to return, so it throws to fail fast rather than returning undefined.
Source
Thrown at packages/angular/common/src/directives/navigation/router-outlet.ts:167
if (context?.route) {
this.activateWith(context.route, context.injector);
}
}
new Promise((resolve) => componentOnReady(this.nativeEl, resolve)).then(() => {
if (this._swipeGesture === undefined) {
this.swipeGesture = this.config.getBoolean('swipeBackEnabled', (this.nativeEl as any).mode === 'ios');
}
});
}
get isActivated(): boolean {
return !!this.activated;
}
get component(): Record<string, unknown> {
if (!this.activated) {
throw new Error('Outlet is not activated');
}
return this.activated.instance;
}
get activatedRoute(): ActivatedRoute {
if (!this.activated) {
throw new Error('Outlet is not activated');
}
return this._activatedRoute as ActivatedRoute;
}
get activatedRouteData(): Data {
if (this._activatedRoute) {
return this._activatedRoute.snapshot.data;
}
return {};
}
View on GitHub (pinned to 625f9c38ad)
Solutions
- Check ionRouterOutlet.isActivated before reading component (or activatedRoute).
- Defer the access until the activate event fires (subscribe to the outlet's activateEvents / stackDidChange).
- Restructure guards/resolvers so they do not depend on the outlet's active instance being present.
- Ensure the outlet is not inside a structural directive that removes it before you read it.
Example fix
// before const active = outlet.component; // throws if not activated // after const active = outlet.isActivated ? outlet.component : null;
Defensive patterns
Strategy: validation
Validate before calling
const activeComponent = outlet.isActivated ? outlet.component : null;
Prevention
- Always check isActivated before reading component or activatedRoute.
- Read the outlet only after its activate event / NavigationEnd.
- Don't access the outlet inside a destroyed view.
When it happens
Trigger: Reading ionRouterOutlet.component (or code that reads it, e.g. a guard/resolver accessing the active instance) during the first change-detection cycle before activateWith has run, or when the outlet has been deactivated and then accessed.
Common situations: Accessing the outlet too early in ngOnInit before the router populated it; a lazy-loaded outlet inside an *ngIf that is read before activation; reading component after the user navigated away and the outlet deactivated; guards that assume an active outlet.
Related errors
- incompatible reuse strategy
- Cannot activate an already activated outlet
- Could not find activated route proxy for view
- Invalid hour cycle "${hourCycle}"
- Invalid hour cycle "${hourCycle}"
AI-assisted analysis of ionic-team/ionic-framework@625f9c38ad (2026-08-12).
Data as JSON: /api/errors/f345fab4e95efae5.
Report an issue: GitHub.