maximelafarie / ngx-smart-modal

Modal/Dialog component crafted for Angular (Ivy-compatible)
https://maximelafarie.com/ngx-smart-modal/
MIT License
325 stars 85 forks source link

Standalone Support #385

Closed mattfiocca closed 9 months ago

mattfiocca commented 9 months ago

I'm just getting started with Angular, v17.0.1, and am setting up a standalone components app bootstrapped with bootstrapApplication(). I can't seem to connect the right dots to make this library work. Are standalone components supported?

I am getting the following console error; hopefully obvious to someone more knowledgeable.

main.ts:62 NullInjectorError: NullInjectorError: No provider for NgxSmartModalStackService!
    at NullInjector.get (core.mjs:5605:27)
    at R3Injector.get (core.mjs:6048:33)
    at R3Injector.get (core.mjs:6048:33)
    at injectInjectorOnly (core.mjs:911:40)
    at Module.ɵɵinject (core.mjs:917:60)
    at Object.NgxSmartModalService_Factory [as factory] (ngx-smart-modal.mjs:284:104)
    at core.mjs:6168:43
    at runInInjectorProfilerContext (core.mjs:867:9)
    at R3Injector.hydrate (core.mjs:6167:17)
    at R3Injector.get (core.mjs:6037:33)

My entrypoint main.ts:

import { importProvidersFrom } from '@angular/core';
import { bootstrapApplication } from '@angular/platform-browser';
import { NgxSmartModalModule } from 'ngx-smart-modal';
import { AppComponent } from 'app.component';

bootstrapApplication(AppComponent, {
  providers: [
    // ...
    importProvidersFrom(NgxSmartModalModule),
  ]
}).catch(e => console.error(e)); // line 62

And the component trying to inject:

import { NgxSmartModalComponent } from 'ngx-smart-modal';

@Component({
  standalone: true,
  // ...
  imports: [
    // ...
    NgxSmartModalComponent,
  ]
})
export class TheComponent {
}
mattfiocca commented 9 months ago

I was doing it wrong...

incorrect:

importProvidersFrom(NgxSmartModalModule)

correct:

importProvidersFrom(NgxSmartModalModule.forRoot())