Angular 19 SSR: Query params not available when running with yarn serve:ssr

I created an app called dummyapp using Angular CLI version 19.2.5 with the --ssr option (ng new dummyapp --ssr).

In the app.component.ts, I'm trying to retrieve the title from the query string. Here's the code I added:

import { Component } from '@angular/core';
import { ActivatedRoute, RouterOutlet } from '@angular/router';

@Component({
selector: 'app-root',
standalone: true,
imports: [RouterOutlet],
templateUrl: './app.component.html',
styleUrl: './app.component.scss'
})
export class AppComponent {
constructor(private route: ActivatedRoute) {
// Trying to read the query param "title"
this.route.queryParams.subscribe(params => {
console.log('Title:', params['title']);
});
}
}


In the browser, I disabled JavaScript to test server-side rendering.

When I run the app using ng serve and navigate to http://localhost:4200/?title=MyTitle, it works — I'm able to display the title passed in the query string.

However, the issue occurs when I don't use ng serve.

Again, I disable JavaScript in the browser to test SSR. Then I run: ng build && yarn serve:ssr:dummyapp

I navigate to: http://localhost:4000/?title=MyTitle

And this time, it doesn't work — the title from the query string is not retrieved.

Is there something different in how Angular handles query parameters in SSR mode vs dev mode (ng serve)? Is there a recommended way to retrieve query params on the server side with Angular 19?

Thanks!

Continue reading...