javascript - Node.js/Express - 如何在 JavaScript 中访问 'req'

Question

所以我加载了一个名为 tournament/:key 的页面，它向它传递了一个 Tournament 对象。正如您从下面看到的，Jade 模板正在访问 Tournament 中的每个变量，例如，使用 #{tournemantData.name} 将打印 Tournament 的 name 到页面。 matches 的集合实际上存储为 Tournament 中的数组，我想通过 JavaScript 文件访问这些，以便在此页面上使用它们，最终我想要生成一组图形括号。

我如何在 JavaScript 文件中访问此 tournamentData？

  app.get('/tournament/:key', function(req, res) {
    util.log('Serving request for url [GET] ' + req.route.path);
    Tournament.findByKey(req.params.key, function(err, tournamentData){
      if(!err && tournamentData){
        tournamentData = tournamentData;
        //util.log(tournamentData.teams[0]);
        res.render('tournamentDetails', { 'tournamentData' : tournamentData, seedsSerialized : JSON.stringify(tournamentData.teams) } );
      } else {
        util.log('Error in fetching Tournament by key : ' + req.params.key);
        res.json({
          'retStatus' : 'failure',
          'msg' : 'Error in fetching Tournament by key ' + req.params.key
        });
      }
    });
  });

Jade :

        p Name: #{tournamentData.name}
        p ID: #{tournamentData._id}
        p Key: #{tournamentData.key}
        p Teams: #{tournamentData.teams}
        p Matches: #{tournamentData.matches}
        p Brackets:
        div.bracket
            #tournamentBrackets
            script(type='text/javascript')
                var seeds = var rankArray = !{seedsSerialized};

方括号.js

numRounds = Math.log(seeds.length) / Math.log(2);

/**
 * Randomize array element order in-place.
 * Using Fisher-Yates shuffle algorithm.
 */
function shuffleArray(array) {
  for (var i = array.length - 1; i > 0; i--) {
    var j = Math.floor(Math.random() * (i + 1));
    var temp = array[i];
    array[i] = array[j];
    array[j] = temp;
  }
  return array;
};

shuffleArray(seeds);

var bracketData = {
    teams : [              // Matchups
        [ seeds[0].name,  seeds[1].name ],
    [ seeds[2].name,  seeds[3].name ]
  ],
  results : [[
      [ [1, 0], [1, 0] ],
      [ [1, 0], [1, 0] ]
    ]]
}

$(function() {
    $('#tournamentBrackets').bracket({
        init: bracketData
    });
});

编辑:我已经添加了 JavaScript 文件，它正在做的是使用 jQuery.bracket(我正在使用的一个 jQuery 项目，用于生成漂亮的括号)，目前您可以看到我已经手动输入了名称团队。

brackets.js 中的括号数组与 tournamentData.matches 中的格式相同，但基本思想是我想从中访问此信息JavaScript 文件，以便我可以打印这些团队的括号。

编辑:

$(document).ready(function() {
  // tournament  is now the same as tournmentData in your express route
  var tournamentText = $(#tournamentData).text();
  var tournament = JSON.parse(tournamentText);
  console.log(tournament, tournament);

  $(function() {
    $('#tournamentBrackets').bracket({
      init: bracketData
    });
  });
}

Answer 1

您已经可以访问 Jade 模板中的变量，这意味着您可以通过 Javascript 在该页面中访问它。

基本上您已经可以访问 tournamentData 对象。

您可以做的是获取该 tournamentData 对象并将其设为全局 JS 变量或将其保留在页面范围内。

在你的模板中有这样的东西

- var matches = tournamentData.matches ;  //Specific scope

或者

- window.matches = tournamentData.matches; //Binded to window object global