httpResource and Input-Signal: How does it work? (Angular 19)

I am creating a blog page, that fetches an article. I am using SSR/SSG.

I have problems using input signals and the new httpResource. Neither response1 nor its alternative response2 work.

export class ArticlePageComponent {
slug = input.required<string>();

response1 = httpResource<BlogPostWrapper>(
() => 'https://foo/' + this.slug(),
); // NG0950: Input is required but no value is available yet

response2 = computed(() =>
httpResource<BlogPostWrapper>(
() =>
'https://foo/' + this.slug(),
),
); // httpResourceRef() can only be used within an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`.
}

Continue reading...