Angular Library with Ionic Components: NullInjectorError: No provider for ChangeDetectorRef!

Ionic Framework
1

I’ve setup an angular library project and trying to include some components in it that have ionic components in them.

Everything works fine, until I try to use an Ionic component in them. This is with Ionic 5.

EDIT: I have a much worse problem, everything is not working fine.
Trying to use *ngIf in the library component yields me an error as well:
“StaticInjectorError(AppModule)[NgIf -> ViewContainerRef]”
Which means something about my angular components library is very broken.
So this is probably more of an angular problem.

The problematic component:

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

@Component({
  selector: 'pct-ng-usersystem',
  template: `
    <p>
      ng-usersystem works!!!???
    </p>
    <ion-button>BTT</ion-button>
  `,
  styles: []
})
export class NgUsersystemComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

Notice how it tries to use an ion-button.

The module exported by the library:

@NgModule({
  declarations: [NgUsersystemComponent],
  imports: [
    CommonModule,
    IonicModule
  ],
  exports: [NgUsersystemComponent]
})
export class NgUsersystemModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: NgUsersystemModule,
      providers: [
        NgUsersystemService
      ]
    }
  }
}

As you can see I am importing IonicModule here and I am tried to fix the problem by importing Angulars CommonModule.
However when I tried to use this Component in an Ionic-Project I get an error:
NullInjectorError: StaticInjectorError(AppModule)[IonButton -> ChangeDetectorRef].

I don’t understand what I am supposed to do, google can’t even find who is normally supposed to provide the ChangeDetectorRef, it seems normally that just falls from the sky and for some reason now it isn’t.

2

So I’ve not solved it, but if google let you here:

It’s something about npm link and angular libraries being stupid with the preserveSymlink option.

1 Like