I have a form which calls the checkOut function upon submission:
<form [formGroup]="submitForm" (ngSubmit)="checkOut(items)">
<input type="submit" value="Check Out">
</form>
The form submission leads to the form carrying over the query parameters:
public checkOut(items: any) {
this.router.navigate(['check-out'], { queryParams: { checkouts: JSON.stringify(this.items) } });
}
this.route.queryParams.subscribe(params => {
this.checkouts = params['checkouts'];
this.objectValues = {...this.checkouts};
}
Then I can add the query parameters to the database like this:
this.checkouts = params['checkouts'];
this.object = Object.assign({}, ...this.checkouts);
create_NewCheckOut(record) {
return this.firestore.collection('Checkouts').add(this.object);
}
this.create_NewCheckOut(this.object).then(resp => {
this.checkoutProductName = "";
this.checkoutQuantity = undefined;
this.checkoutProductPrice = undefined;
})
.catch(error => {
console.log(error);
});
});
this.arrayToObject2 = JSON.parse( JSON.stringify( this.checkouts ) );
<div *ngFor="let out of arrayToObject2">
<h5>Product Name: {{out.product_name}}</h5>
<h6>quantity: {{out.quantity}} </h6>
<p>Price: {{out.product_price}}</p>
</div>
But alas no data was added to the database.