在 Pug 文件中随机填充 table 行

Question

直到今天早上，我才知道帕格是什么。但是，现在，它被用于我工作中使用的主题中。运行进入这种情况。

当前的 pug 文件如下所示。

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 0,800
        tr
            td Garrett Winters
            td Accountant
            td Tokyo
            td 63
            td 2011/07/25
            td 0,750

有什么方法可以使用一些随机数组用 javascript 填充此数据。例如，假设我有一个这样的数组。后来，我总能写一些简单的JavaScript代码来构建一个包含数百个名称、位置等的集合。

但是，现在，让我们以这个数组为例。

let someStuff = [
  {
    name : "Bruce Wayne",
    position : 'CEO',
    city : 'Gotham City',
    Age : '69',
    Date : '2008/11/13',
    Salary : '3,000'
  },
  {
    name : "Dick Grayson",
    position : 'CFO',
    city : 'Bludhaven',
    Age : '59',
    Date : '2008/11/13',
    Salary : '0,000'
  }
];

如何将此数组提供给上面的 pug 文件？

原始 pug 文件，以及我正在使用的 code/theme/template 的其余部分可在此处获得 - https://github.com/StartBootstrap/startbootstrap-sb-admin/blob/master/src/pug/pages/includes/datatable.pug

我看过这个问题，How do I dynamically populate a radio button using Jade/Pug，它看起来很相似，但我无法理解如何将我的数组包含到我的 pug 文件中。

我只是尝试将对象放入文件中，就像这样。

let someStuff = [
  {
    name : "Bruce Wayne",
    position : 'CEO',
    city : 'Gotham City',
    Age : '69',
    Date : '2008/11/13',
    Salary : '3,000'
  },
  {
    name : "Dick Grayson",
    position : 'CFO',
    city : 'Bludhaven',
    Age : '59',
    Date : '2008/11/13',
    Salary : '0,000'
  }
];

table#datatablesSimple
    thead
        tr
    //rest of the code

这会出错。

[SB_WATCH]   var err = new Error(fullMessage);
[SB_WATCH]             ^
[SB_WATCH]
[SB_WATCH] Error: src\pug\pages\includes\datatable.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 "{

Answer 1

请注意 - 位于单独的一行。这将允许您初始化 pug 中的变量。

- 
  let someStuff = [
    {
      name : "Bruce Wayne",
      position : 'CEO',
      city : 'Gotham City',
      Age : '69',
      Date : '2008/11/13',
      Salary : '3,000'
    },
    {
      name : "Dick Grayson",
      position : 'CFO',
      city : 'Bludhaven',
      Age : '59',
      Date : '2008/11/13',
      Salary : '0,000'
    } 
  ];

这将解决您的错误。

参考：

此外，您可以按如下所述遍历该数组：

tbody
    each stuff in someStuff
      tr
        each val, key in stuff 
          td=val

在 Pug 文件中随机填充 table 行

Randomly Populate table rows in Pug files

javascript

pug