Angular : unable to load component from library : Cannot read properties of null (reading '11')

Question

Under my Angular app

I'm trying to load a component which i'm getting from a local angular library

My component (from library) looks like this :

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

@Component({
  selector: 'lib-ada-headband-lib',
  templateUrl: './ada-headband-lib.component.html',
  styleUrls: ['./ada-headband-lib.component.scss']
})
export class AdaHeadbandLibComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }

}

its view html looks like this :

<span>
  ada-headband-lib works!
</span>

Under my principal Angular project

I'm getting this from the library by importing the library in the app.module as a module

and then , i'm putting is under my app.component.html like this :

  <section>
    <lib-ada-headband-lib></lib-ada-headband-lib>
  </section>

But it fails to load throwing this error :

core.js:6479 ERROR TypeError: Cannot read properties of null (reading '11')
    at Object.Jv (core.js:14869:1)
    at template (ada-headband-lib.component.ts:8:14)
    at bc (core.js:9599:1)
    at id (core.js:9402:1)
    at Za (core.js:10683:1)
    at core.js:9267:1
    at id (core.js:9427:1)
    at L0.createEmbeddedView (core.js:23026:1)
    at F0.createEmbeddedView (core.js:23157:1)
    at Fn._updateView (common.js:3463:1)

Sinc it seems to not be significant , how may i adjust it ??