3

I have this structure

<accordion>
    <accodrion-item>
        <accordion-head [title]="'Header 1'"></accordion-head>
    </accordion-item>
</accordion>

@Component({
    selector: 'accordion-head',
    template: '<h3 (click)="toggleItem($event)">{{ title }}</h3>
})

export class AccordionHead {
    @Input() title;
    @Output() handleToggleItem = new EventEmitter();

    toggleItem() {
      this.handleToggleItem.emit(this);
    }
}

@Component({
    selector: 'accordion-item',
    template: '<ng-content></ng-content>'
})

@Component({
    selector: 'accordion',
    template: '<ng-content></ng-content>'
})

I want to listen on handleToggleItem in AccordionItem/Accordion component. How to do this? I dont want to use any service.

corneliusz
  • 108
  • 1
  • 9
  • Here are two links with similar issues: http://stackoverflow.com/questions/34802210/angular-2-child-component-events-broadcast-to-parent http://stackoverflow.com/questions/40835362/angular-2-child-reference-to-variable-into-parent – AT82 Jan 06 '17 at 19:04
  • But my component are in ng-content and @Output() EventEmitter does not working. I cant listen on it on AccordionComponent or AccordionItemComponent. – corneliusz Jan 06 '17 at 20:23
  • Would this be better? http://stackoverflow.com/questions/34802210/angular-2-child-component-events-broadcast-to-parent – AT82 Jan 06 '17 at 20:24
  • I tried it but directives are not allowed in the component in newest Angular 2 version. Service are not good too like in this example http://plnkr.co/edit/JhERu0VsjuUyqBVFU0TY?p=preview When you add secondary instance of , service executed in both on them. – corneliusz Jan 06 '17 at 20:29

0 Answers0