Pug able to access a nested array from a mongo database Json - arrays

Question

I am trying to output the array dependencies from the mongodb object. I have tried nearly everything but keep getting length of undefined.
I can output the whole object but I want the name version of each dependencies.
{ _id: 5c6eea28c6c23a15beb43419,
Repo_id: [ 1 ],
name: 'express-ibm',
version: '0.0.0',
dependencies:
[ { name: 'async', version: '2.6.1' },
{ name: 'body-parser#1.18.3', version: '1.18.3' },
{ name: 'cookie-parser#~1.4.3', version: '1.4.3' },
{ name: 'debug#~2.6.9', version: '2.6.9' },
{ name: 'express#~4.16.0', version: '4.16.4' },
{ name: 'http-errors#~1.6.2', version: '1.6.3' },
{ name: 'mongoose', version: '5.3.13' },
{ name: 'morgan#~1.9.0', version: '1.9.1' },
{ name: 'pug#2.0.0-beta11', version: '2.0.0-beta11' } ] }
// Display detail page for a specific Repo
exports.repo_search = function(req, res, next) {
Repo.findById(req.params.id).populate('repo').exec(function(err, repo) {
if (err) {
return next(err);
}
if (repo == null) {
// No results.
var err = new Error('Repo copy not found');
err.status = 404;
return next(err);
}
console.log(repo);
Repo.find().exec(function(err, list) {
if (err) {
return next(err);
}
res.render('repo_info_detail', {
title : 'Repo Detail',
repo : repo,
list : list
// repo_dependencies: results.repo_search
});
});
});
};
Pug:
extends layout
block content
p#demo
h1 #[Repository Name :] #{repo.name}
dd #[ IBM Github URL:]
a(href='/'+repo.url) #{repo.url}
dd #[ Repository ID:] #{repo._id}
dd #[ Language Type:] #{repo.filetype}
dd #[Repo ID :] #{repo.Repo_id}
//dd #[dependencies: ] #{repo.dependencies.name}
div(class='col')
div(class='col-sm-8')
p
button.hidediv Hide dependencies
button.showdiv Show dependencies
.divdemo
| Dependencies
.button
a#export(href='#', role='button')
| Click On This Here Link To Export The Table Data into a CSV File
div(class='col')
div(class='col-sm-3')
table
thead
tr: th Name
tbody
each d in repo
tr
td
dd #{repo}

Answer 1

repo is a javascript object, and you're correctly accessing its properties using dot syntax (e.g. repo.name or repo.dependencies). However, repo.dependencies is an array of objects. It doesn't have a name property that can accessed using dot syntax. Instead, you'll have to loop through the child objects and access each of their name properties in turn.
h1 Repository Name: #{repo.name}
dl
dt IBM Github URL:
dd #[a(href='/'+repo.url) #{repo.url}]
dt Repository ID
dd #{repo.Repo_id}
dt Dependencies
each dependency in repo.dependencies
dd #{dependency.name} (v#{dependency.version})
Have a look at the syntax for pug tab interpolation, it looks like you're using it incorrectly in your example.
Also, check out the documentation on the proper usage of dd elements and how they should be used with dt elements. They also must be children of a description list (dl) element: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl