covert hound
Hey guys,
Learning angular so go easy on me
I have 3 components inside of my app. 1 parent, 2 children
One is a form where a user submits an "Order" and that order's information gets stored into firebase.
The other component is a "recent orders" display table that gets the orders from firebase and displays the order information for each order.
These components are siblings, so I need to send the event from one child, to the parent, to the other child.
My goal is to update the recent orders table after a new order is submitted. To do this, I have created a custom event inside of my Order Submission component (child) that I am wanting to be received by the parent. However, I cant seem to receive the event inside of the parent component.
relevant code
default.component.html (implements the child, maybe issue with event bind?)
<app-order-input-form (orderCreated)="onOrderCreated($event)" style="display: inline-block;width: 50%;"></app-order-input-form>
default.component.ts (parent, should receive the event)
onOrderCreated({wasOrderCreated: boolean}){
console.log("an order was created") //never happens
//need to refresh table in tasks display
}
order-input-form-component.ts (submits the order to firebase, should emit an event to parent afterwards)
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Output() orderCreated = new EventEmitter<{wasOrderCreated:boolean}>();
constructor(private http: HttpClient){}
onSubmitOrder(){
this.http.post(`REDACTED_FIREBASE.json`, {REDACTED_PAYLOAD}
).subscribe(resp => {
console.log(resp) //firebase order storing works correctly
//Now need to update orders display
//Emit order created event
console.log("trying to emit signal"); //debug. gets logged.
this.orderCreated.emit({wasOrderCreated:true});
});
please let me know if theres anything I need to clarify, thank you
red urchin