how can i add product to wishlist from angular frontend and display all those products in wishlist component in my angular app?

Question

I have node API which is hosted somewhere else and my Angular project is in different drive. I want to add product to wishlist from frontend and display it in wishlist component. Node API is working perfectly fine I have tested it on postman app.

This is my routes/user.js code:

router.post("/wishlists", async (req, res) => {
    try{
        let body = req.body;
        let wishlists = await Wishlist.find({userid:body.data.userid});
        res.end(JSON.stringify({status:"success", data:wishlists}));        
    }
    catch{
        res.end(JSON.stringify({status:"failed", data:"Something went wrong"}));        
    }
});

This is my models/Wishlist.js:

let mongoose = require("mongoose");
let Schema = mongoose.Schema;
let schema = new Schema(

{
  userid:{type:String, required:true},
  products:[]
});
let Wishlist = mongoose.model("wishlists", schema);
module.exports = Wishlist;

This is my routes/wishlist.js:

// Add item to wishlist
router.post("/add", async (req, res) => {
  try{
    let body = req.body;
    let wishlist = new Wishlist();
    wishlist.userid = body.data.userid;
    wishlist.products = body.data.products;
    wishlist.save().then(result=>{
        res.end(JSON.stringify({status:"success", data:result}));
    }, err=>{
        res.end(JSON.stringify({status:"failed", data:err}));
    });
}
catch{
    res.end(JSON.stringify({status:"failed", data:"Something went wrong"}));
}
});