[SOLVED] How do I provide parameters for the component when working with imperative Dialogs?

How do I provide parameters for the component when working with imperative Dialogs?

when working with imperative dialogs, as shown on the demo page:

let pDialog = this.dialogService.showCustomDialog({
  component: LoginDialogComponent,
  providers: [{provide: TEST_VALUE, useValue: 'Just an example'}],
  isModal: true,
  styles: {'width': '350px'},
  clickOutsideToClose: true,
  enterTransitionDuration: 400,
  leaveTransitionDuration: 400
});

How do I provide arguments for the LoginDialogComponent, should it need some? Is this even possible?

Thanks in advance, c

Solution

In the example there is already some code for this use-case.

providers: [{provide: TEST_VALUE, useValue: 'Just an example'}],

You can use this to inject the string Just an example into the construtor of LoginDialogComponent.

Before you have to initialize TEST_VALUE the following way:

const TEST_VALUE = new OpaqueToken("test_value");

Then you can extend your components constructor this way to get the value:

constructor(@Inject(TEST_VALUE) private myValue: string) {}

Instead of a string you can also pass an object. This would look this way:

providers: [{provide: TEST_VALUE, useValue: <IMyDialogArgs>{
    foo: "foo",
    bar: 0
}}],