Angular 4 - Calling a parent method from a child component not working

Viewed 11283

All of my event emitters are working properly except for one.

child.ts:

@Component({
    ... 
    outputs: ['fileUploaded']
    })

export class childComponent implements OnInit {
  ...
  fileUploaded = new EventEmitter<boolean>();
  ...
  randomMethod(){
     ...
     this.fileUploaded.emit(true);
  }

}

randomMethod() is called from the parent component as I'll show in parent.ts. It is not called in child.html.

parent.html

...
<child (fileUploaded)="onSubmit($event)"></child>
..

parent.ts

export class parentComponent {
   ...
   theChild = new childComponent;
   submitted = false;
   ...
   onSubmit(event: boolean) { 
     console.log('in onSubmit()');
     this.submitted = event;
  }

  functionCallsChild(){
     this.theChild.randomMethod();
     ...
     this.theChild = new childComponent;
  }
}

My app never logs "in onSubmit()" so why isn't this method being called? I also tried to not create a new child object on my last line but that didn't make a difference.

5 Answers
Related