Angular 19 Injection context problems when using components from own library

Discussão em 'Angular' iniciado por kanekimon, Agosto 25, 2025.

  1. kanekimon

    kanekimon Guest

    I'm currently working on a angular 19 project, and we created a library with some components. The components were first implemented in the main project, and everything worked perfectly, when we migrated the components to the library, we started to get the following issue:

    NG0203: inject() must be called from 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

    I tried several different approaches but nothing works. Both the project and the library use same angular versions. Both use standalone components.

    Are there any known issues?

    Tried to remove all injection in the library ( was using cdr ) which also did not work. Added path mapping to the tsconfig for the library, which did nothing.

    The component i use :

    @Component({
    selector: 'arc-grid',
    standalone: true,
    imports: [CommonModule, AgGridAngular],
    templateUrl: './arc-grid.component.html',
    styleUrls: ['./arc-grid.component.css'],
    })
    export class ArcGridComponent implements OnChanges, OnDestroy {
    //@inputs and @outputs to handle data and events
    }



    * Public API Surface of arc
    */
    export * from './lib/grid/arc-grid.component';
    export * from './lib/grid/arc-grid.types';
    export * from './lib/grid/arc-grid-setup';
    export * from './lib/grid/arc-grid.service';
    export * from './lib/services/arc-grid-data.interface';
    export * from './lib/services/arc-grid-data-service-base';


    How i use it in the component in my main project

    <div class="feature-a-grid-wrapper grid-scroll-container" style="height: 60vh;">
    <arc-grid style="height: 100%;" #grid
    [columnDefs]="gridColumns"
    [gridConfig]="gridOptions"
    [dataService]="psGridService"
    [getContextMenuItems]="getContextMenuItems"
    [gridStateKey]="'ps-grid-state'"
    (gridReady)="onGridReady($event)">
    </arc-grid>
    </div>


    @Component({
    imports: [CommonModule, ArcGridComponent],
    selector: 'app-psgrid',
    standalone: true,
    templateUrl: './psgrid.component.html',
    styleUrl: './psgrid.component.scss',
    })
    export class PSGridComponent {
    // lots of code
    }

    Continue reading...

Compartilhe esta Página