Until this morning, I did not know what Pug is. However, now, it’s being used in a theme that I am using for work. Ran into this situation.
The current pug file looks like this.
table#datatablesSimple
thead
tr
th Real Name
th SuperHero Name
th City
th Age
th Start date
th Crime Related Expenses
tfoot
tr
th Name
th Position
th Office
th Age
th Start date
th Salary
tbody
tr
td Tiger Nixon
td System Architect
td Edinburgh
td 61
td 2011/04/25
td $320,800
tr
td Garrett Winters
td Accountant
td Tokyo
td 63
td 2011/07/25
td $170,750
is there any way to fill up this data with javascript, using some random array. For instance, suppose I have an array like this. Later, I could always write some simple JavaScript code to build a collection with hundreds of names, position and so on.
But, for now, let’s take this array as example.
let someStuff = [
{
name : "Bruce Wayne",
position : 'CEO',
city : 'Gotham City',
Age : '69',
Date : '2008/11/13',
Salary : '$183,000'
},
{
name : "Dick Grayson",
position : 'CFO',
city : 'Bludhaven',
Age : '59',
Date : '2008/11/13',
Salary : '$600,000'
}
];
How could I feed this array to the pug file above?
The original pug file, and the rest of the code/theme/template I am using is available here – https://github.com/StartBootstrap/startbootstrap-sb-admin/blob/master/src/pug/pages/includes/datatable.pug
I have looked at this question, How do I dynamically populate a radio button using Jade/Pug, which seems similar, but I am not able to understand how to include my array into my pug file.
I simply tried putting the object in the file, like this.
let someStuff = [
{
name : "Bruce Wayne",
position : 'CEO',
city : 'Gotham City',
Age : '69',
Date : '2008/11/13',
Salary : '$183,000'
},
{
name : "Dick Grayson",
position : 'CFO',
city : 'Bludhaven',
Age : '59',
Date : '2008/11/13',
Salary : '$600,000'
}
];
table#datatablesSimple
thead
tr
//rest of the code
That gives an error.
[SB_WATCH] var err = new Error(fullMessage);
[SB_WATCH] ^
[SB_WATCH]
[SB_WATCH] Error: srcpugpagesincludesdatatable.pug:2:3
[SB_WATCH] 1| let someStuff = [
[SB_WATCH] > 2| {
[SB_WATCH] ---------^
[SB_WATCH] 3| name : "Bruce Wayne",
[SB_WATCH] 4| position : 'CEO',
[SB_WATCH] 5| city : 'Gotham City',
[SB_WATCH]
[SB_WATCH] unexpected text "{
Advertisement
Answer
Note that the – is on a separate line. This will allow you to initialize the variable in pug.
-
let someStuff = [
{
name : "Bruce Wayne",
position : 'CEO',
city : 'Gotham City',
Age : '69',
Date : '2008/11/13',
Salary : '$183,000'
},
{
name : "Dick Grayson",
position : 'CFO',
city : 'Bludhaven',
Age : '59',
Date : '2008/11/13',
Salary : '$600,000'
}
];
This will resolve your error.
Reference: Write pug array in multiple lines
Further, you can iterate over that array as mentioned below:
tbody
each stuff in someStuff
tr
each val, key in stuff
td=val