Using input Signal in Angular Library

When using an Angular (19) Library project within another Angular 19 Application project (these are separate projects) using npm link, I get following runtime error when building the application for production:

ERROR Error: NG0203: inputFunction2() can only be used within an injection
context such as a constructor, a factory function, a field initializer, or
a function used with `runInInjectionContext`. Find more at
https://angular.dev/errors/NG0203


(In order to receive this error, I set "optimization": false in angular.json.)

I am confused as I believe that I am within a injection context (see example of the component). However, when I run the project in the development environment using npm run start, then the application works like a charm.

The issue is an input signal in my component (full minimal working example later in question):

label = input<string>('');


If I remove that, it works well. I also tried to use @Input with a Signal but I get a similar error.

Is it not possible to use Signals in an Angular Library project?


I have an Angular (19) Library project:

ng new components --create-application=false
ng generate library my-components
ng generate component my-components/info-tooltip


The library is added to the application project using npm link respectively npm link my-components. (As mentioned, everything works very well in the development enviroment.)

A minimal version of InfoTooltipComponent that reproduces the issue:

import { Component, input, ViewEncapsulation } from '@angular/core';

@Component({
selector: 'app-info-tooltip',
imports: [],
template: '<p>{{label()}}</p>',
styles: [],
encapsulation: ViewEncapsulation.ShadowDom,
})
export class InfoTooltipComponent {

label = input<string>('');

}


Then in my application project, I am using the component as following:

import { Component } from '@angular/core';

import { InfoTooltipComponent } from 'my-components';

@Component({
selector: 'app-test',
imports: [InfoTooltipComponent],
template: `
<app-info-tooltip label="Hello, World!"></app-info-tooltip>
`,
styles: [],
})
export class TestComponent {

}

Continue reading...