The archivement is to use a base component where I would be able to render a default list of items or a customized one, to do so I’ve create a base component that has the mat-select-list in it like this:

<mat-selection-list class="pt-0" [multiple]="false" #list>
    <ng-content>
    @for (item of items(); track $index) {
        <mat-list-option [value]="{ id: item.id, name: item.name }">{{ item.name }}</mat-list-option>
    }            
    </ng-content>
</mat-selection-list>

The base mat-list-option has as the value the { id: item.id, name: item.name } and as the content {{ item.name }}, when I use this base component without passing any ng-content so by using the default one, I have no issues and the component behave as it has to.

The issue is when I try to use a custom in ng-content in a component like this:

@Component({
  selector: 'app-product-select-modal',
  standalone: true,
  imports: [BaseSelectModalComponent, MatListOption],
  template: `
    <app-base-select-modal title="Seleziona la licenza" [items]="items()" [itemsCount]="count()" [isLoading]="isLoading()" (onClose)="close()" (onConfirm)="confirm($event)">
      @for (item of items(); track $index) {
          <mat-list-option [value]="item">
            <div>{{ item.product.name }}</div>
            <span>{{ item.key }}</span>
          </mat-list-option>
      }
    </app-base-select-modal>
  `,
})
export class LicenseSelectModalComponent {
...
}

I just get NullInjectorError: NullInjectorError: No provider for InjectionToken SelectionList! error when the base-select-modal is trying to render.

I’ve tried yet to import MatListModule even in the LicenseSelectModalComponent but it has no effect.

Here is the base-select-modal:

@Component({
  selector: 'app-base-select-modal',
  standalone: true,
  imports: [MatDialogModule, MatButton, MatFormField, MatInput, MatLabel, MatListModule, ReactiveFormsModule, MatProgressSpinnerModule],
  templateUrl: './base-select-modal.component.html',
  styleUrl: './base-select-modal.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class BaseSelectModalComponent {
...
}