I'm trying to format the following models into a single post request JSON format as such:

{ 
"id": 12,
"address":{
    "firstName": "john",
    "lastName": "doe",
    "address": "testaddress",
    "country": "us",
    "apartmentNo": "12",
    "state": "ohio",
    "city": "washington",
    "zipcode": "45133"
},
"payment":{
    "cardHolder": "jane doe",
    "cardNumber": "1234123412341234",
    "expirationDate": "10/22",
    "cvv": "123"
},
"items":[
    {
        "id":1234,
        "name": "basketball",
        "price": 15,
        "imageUrl": "imageurl",
        "quantity": 0,
        "inventory": 100
    },
    {
        "id":1235,
        "name": "football",
        "price": 25,
        "imageUrl": "imageurl",
        "quantity": 0,
        "inventory": 100
    }
  ]
}

Now, this is the format I want my POST to be in. I will be adding the following 3 models, plus an "id" (seen on first line of the JSON) variable. Here are my following three models:

Address Model:

export class Address {
address!: String;
firstName!: String;
lastName!: String;
country!: String;
apartmentNo!: String;
state!: String;
city!: String;
zipcode!: String;
}

Payment Model:

export class Payment {
cardHolder!: String;
cardNumber!: String;
expirationDate!: String;
cvv!: String;
}

Item Model:

export class Item{
id!:number;
name!:string;
price!:number;
imageUrl!:string;
quantity?:number;
inventory!:number;
}

I have tried the following which is not working:

this.paymentInfoService.setPaymentInfo(this.payment);
this.orderId = "1";
this.address = this.shippingService.getShippingInfo();
this.cart = this.cartService.getCart();
this.cartJSON = JSON.stringify({cart: this.cart}); //not using this right now
this.fullPost = Object.assign({"id": this.orderId}, this.address, this.payment, 
this.cart);
this.apiService.sendOrder(this.fullPost).subscribe(
  (response) => console.log(response),
  (error) => console.log(error)
);

CodePudding user response：

You need to create a model to represent the entire object you are trying to send and also create the instance of that model with the values. it would look something like this:

export class Order{
   id : number,
   address : Address,
   payment : Payment,
   Items : items[]
}

And then go about creating an instace of the object and put all of the data in it.

let _order = new Order { id: 1,
                         address: this.address,
                         payment: this.payment,
                         items: this.cartJSON
                       }

this.apiService.sendOrder(this.fullPost).subscribe(
   (response) => console.log(response),
   (error) => console.log(error)
 );

assigning it to a object of any does not give angular a proper way to create the Json for the object you are trying to make a request on.

CodePudding user response：

1. Create an Order model with the following properties.

   export class Order{
   id!: String;
   address!: Address;
   payment!: Payment;
   items!: Items[];
   }
   

2. Instantiate the fullPost variable as an Object of Order class and assign the values to it.

   this.fullPost = new Order();
   this.fullPost = {
   id: this.orderId,
   address: this.address,
   payment: this.payment,
   items: this.cart
   }
   

3. Use the fullPost object in the api.

   this.apiService.sendOrder(this.fullPost).subscribe(
   (response) => console.log(response),
   (error) => console.log(error));