How to pass JSON data into pug template without render()?

in my case, the scenario is when i click a button the value of sort, cost range and the type of Cuisine is got through the JS code then i send a post axios request from that and then passing the data from client side to server side ,where i use a controller to get the values of those data, then i send an axios GET request to the Route which is defined in my code to get the information from the database ,the problem which i face is HOW TO SEND the data from my server to frontend pug template because when i use res.render() it shows internal server error in my browser but when i use res.json() , i can see the output in my console ,so the problem is with my controller function i guess ? so can anyone look into my problem and provide a solution

exports.filter = catchAsync(async (req, res, next) => {
  try {
    let cost = req.query.cost;
    const cuisine = req.body.params.Cuisine;
    const Sort = req.body.params.sort;
    let paramobj = {};
    if (cuisine) {
      paramobj.Cuisine = cuisine;
    }
    if (Sort) {
      paramobj.sort = Sort.toString();
    }
    if (!cost) {
      cost = "";
    } else {
      cost = `?${cost}`;
    }
    const data = await axios.get(
      `http://localhost:3000/api/ver1/restaurant${cost}`,
      {
        params: paramobj,
      }
    );
    const restaurantinloc=data.data.data
    
      res
        .status(200)
        .render("restaurantcard", {
          restaurantinloc,
        });
    
    // .json(restaurantinloc);
  } catch (err) {
    console.log(err);
  }
});

everything works fine when i use res.json(restaurantinloc) but when i use res.render() it shows internal server error and not rendering the page