Angular5-Toaster Dynamic component inject parameters

Question

Good afternoon,

I am trying to create a dynamic template to display information from a dynamic component as listed in the NPM readme. https://www.npmjs.com/package/angular5-toaster

Example :

import {BodyOutputType} from 'angular5-toaster';

@Component({
  selector: 'dynamic-component',
  template: `<div>loaded via component</div>`
})
class DynamicComponent { }

var toast : Toast = {
    type: 'error',
    title: 'Title text',
    body: DynamicComponent,
    bodyOutputType: BodyOutputType.Component
};

this.toasterService.pop(toast);

My question is how would i pass parameters into the DynamicComponent.

Thanks

why can't you set the value in to a service before loading the component? Once component initialize you can read the value — Jameel Moideen, Nov 15 '18 at 15:45
Really good idea i have no idea why i didn't think of it before. — user1403598, Nov 15 '18 at 16:26
Thanks..I would suggest this solution. Also one more way by creating instance of the component but not recommended. You can go with this approach. — Jameel Moideen, Nov 15 '18 at 16:29
I have added this solution as an answer , If it's works you can mark it as an answer — Jameel Moideen, Nov 15 '18 at 16:47

score 0 · Accepted Answer · answered Nov 15 '18 at 16:46

I would suggest to share the data using Angular Service.

Step 1 : set the data want to pass in to the dynamic component before you load the Toast.

    this.someService.data="some parameter"
    this.toasterService.pop(toast);

Step 2 : Once the component initialize you can read the value by injecting the service as a dependency on your dynamic component.

ngOnInit(){
//read the data
console.log(this.someService.data)
}

Angular5-Toaster Dynamic component inject parameters

1 Answers1