1

I have two components Main (parent) and Header (child). I want to add buttons in my Header component from the Main component. Clicking the button should change a state in my Main component. I don't want it to be hardcoded, but rather passing an Array of objects from Main component to Header component. Clicking the button in header should trigger a state change in my Main component. I know how to do it by using @Input and @Output decorators using EventEmitters, however i want to provide like a callback function in the array object to call in my parent component. Is it possible to do?

Sorry if this sounds little weird - i dont know how else to explain it :) Here is a prototype of the Array i want to pass:

headerButtons: Array<any> = [{title: 'Button 1', callback: 'callbackMethod1'}, {title: 'Button 2', callback: 'callbackMethod2'}];

Hassan
  • 2,308
  • 5
  • 21
  • 31
  • 3
    Possible duplicate of [Angular2 pass callback function to child component as @Input](http://stackoverflow.com/questions/35328652/angular2-pass-callback-function-to-child-component-as-input) – jmachnik Oct 13 '16 at 10:24
  • 1
    if you do not want to hardcode then possibly you can use Observable as explained in http://stackoverflow.com/questions/39738974/can-i-emmit-the-event-from-parent-to-child-in-angular2/39739184#39739184 – ranakrunal9 Oct 13 '16 at 10:31

0 Answers0