CODEWITHSUNDEEP
javascriptnode.jsmongodbexpress
leed38
leed38

Reputation: 326

node.js : How do I pass in multiple variables into a view?

I'm trying to create a webpage where there is an instance of all the current Projects I am working on, on the left, so I'd need a .forEach() function in order to loop through all of them in order to display it, but on the other side, I need to display the information that is currently selected.

Please first take a look at my code block so I can try to explain the thought process behind what I was trying to do.

So I didn't have any problems selecting the information of the single project that I needed to display on this webpage. I used the .findOne() function in order to pick out the information that I needed.

The problem that I'm facing is that I also need to pass a var that's connected to the .find() function in order to pass through all of the elements of the database. The way I went about this is that I thought I would be able to set the definition of allProjects by manually running the .find() function, and then returning it, thus assigning Projects.find() to allProjects.

app.get('/projects/:url', (req, res) => {
    Projects.findOne({ Url: req.params.url }, (err, foundProject) => {
        if (err) {
            console.log(err);
        } else {
            res.render('show', {
                foundProject: foundProject,
                allProjects: Projects.find({}, (err, allProjects) => {
                    if (err) {
                        res.send('error');
                    } else {
                        return allProjects;
                    }
                })
            });
        }
    });
});

I thought that by returning allProjects and then also having that assigned to allProjects, i'd be able to use the allProjects variable in my show.ejs page.

Unfortunately, I'm getting an error 'allProjects.forEach() is undefined' which leads me to believe that in the app.js where I am defining allProjects, it's not being assigned the correct value that I want it assigned.

Upvotes: 1

Views: 797

Answers (1)

tadman
tadman

Reputation: 211610

It looks like you're expecting return allProjects to do something, but that's actually ignored. Unless you have a callback function you can call, that will go into the void and never be seen by anyone. This is true of virtually all callback functions. They do not care what value that function returns because it's never relevant, what they want is the future value which comes through the callback given to this function.

In other words it plays out like this:

asyncFunctionTakingCallback(function(cb) {
  cb(null, value); // This is the important value!
  return value; // Nobody cares about this value. Don't even bother.
});

To fix that you need to move the render call inside of the inner-most callback function:

app.get('/projects/:url', (req, res) => {
  Projects.findOne({ Url: req.params.url }, (err, foundProject) => {
    if (err) {
        console.log(err);
        // Return here to avoid another level of indentation below
        return;
    }

    Projects.find({}, (err, allProjects) => {
      if (err) {
        res.send('error');
      } else {
        res.render('show', {
          foundProject: foundProject,
          allProjects:
        });
      }
    });
  });
});

Now that's still a dizzying amount of code and the nesting here is getting completely out of control even though this is relatively simple Node code.

For comparison here's a version that uses async functions:

app.get('/projects/:url', async (req, res) => {
  let foundProject = await Projects.findOne({ Url: req.params.url });

  res.render('show', {
    foundProject: foundProject,
    allProjects: await Projects.find({})
  });
});

There's really not much to it this way. What await does is basically stall out on that line and wait for the promise to get resolved or produce an error. Any errors produced should be captured with try { ... } catch as usual.

Upvotes: 2

Related Questions