title: An error occurred: @Output not initialized
body: <p>I'm working on an angular app for managers to keep track of their teams, and I'm stuck with an @Output error :</p>
  
  <pre><code>An error occurred: @Output deleteMeeting not initialized in 'MeetingItemComponent'.
  </code></pre>
  
  <p>I have a Meetings component, generating a list of MeetingItem components. I want to perform actions when the user clicks on different buttons (edit, delete, show details).</p>
  
  <p>Here is my parent Meetings template :</p>
  
  <pre><code>&lt;div class="meeting__list" [@newMeeting]="meetings.length"&gt;
    &lt;app-meeting-item
      *ngFor="let meeting of meetings"
      [meeting]="meeting"
      (deleteMeeting)="deleteMeeting($event)"
      (openMeetingDialog)="openMeetingDialog($event)"
      (messageClick)="openMessage($event)"
    &gt;&lt;/app-meeting-item&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My MeetingItem template (only the part concerned by this post) :</p>
  
  <pre><code>&lt;span class="meeting__actions"&gt;
      &lt;mat-icon *ngIf="meeting.message" (click)="onMessageClick(meeting)" matTooltip="Read the message"
        matTooltipPosition="above" class="icon--notes"&gt;notes&lt;/mat-icon&gt;
      &lt;mat-icon (click)="onOpenMeetingDialog(meeting)" matTooltip="Edit this meeting" matTooltipPosition="above" class="icon--edit"&gt;edit&lt;/mat-icon&gt;
      &lt;mat-icon (click)="onDeleteMeeting(meeting.id)" matTooltip="Delete this meeting" matTooltipPosition="above" class="icon--delete"&gt;delete_outline&lt;/mat-icon&gt;
    &lt;/span&gt;
  </code></pre>
  
  <p>My MeetingItem component :</p>
  
  <pre><code>import { Component, Input, Output } from '@angular/core';
  import { EventEmitter } from 'events';
  
  @Component({
    selector: 'app-meeting-item',
    templateUrl: './meeting-item.component.html',
    styleUrls: ['./meeting-item.component.scss']
  })
  export class MeetingItemComponent {
  
    @Input() meeting;
  
    @Output() deleteMeeting = new EventEmitter();
    @Output() openMeetingDialog = new EventEmitter();
    @Output() messageClick = new EventEmitter();
  
    constructor() {}
  
    onDeleteMeeting(meetingId) {
      this.deleteMeeting.emit(meetingId);
    }
  
    onOpenMeetingDialog(meeting) {
      this.openMeetingDialog.emit(meeting);
    }
  
    onMessageClick(meeting) {
      this.messageClick.emit(meeting);
    }
  }
  </code></pre>