javascript - 通过 AJAX 渲染 Jade 模板并尝试独立于 HTML 传递/访问数据

标签 javascript html node.js express pug

我正在通过 res.render 使用 Express 在 ajax 调用上渲染 Jade 模板。问题是我想随 HTML 一起传回一些 JSON 变量或 Javascript 对象。

这是否可能以一种优雅的方式实现,或者根本不可能实现?我知道我可以将脚本标记与 HTML 一起传递,但我不确定如何直接在“数据”响应中访问这些值。

示例如下:

- var someNumber = 89
h1 Hello World
li #{someNumber}

通常在 ajax 调用中,您会在该模板的 res.render() 中返回

<h1> Hello Wolrd </h1>
<li> 89 </li>

全部采用 HTML 格式。

如何访问回调中的 HTML Node 之一?最好使用 jQuery 选择器,例如 $('h1 li')。我需要访问回电中的号码,但它似乎没有捕获它。我正在考虑监听器或添加延迟,或者可能我需要将其分配给字符串并将其解析出来。

最佳答案

不完全确定我理解这个问题。但是,要通过 Jade 将 JSON 直接传递到浏览器。在您的路线逻辑中,您需要类似以下内容:

    res.render "test",
    title: "Test"
    debugJson: {
      'Read Folder Result' : result, 
      'HTTP' : {
        'Req URL' : req.url,
        'Req Query' : req.query,
        'Req User' : req.user,
        'Req Headers' : req.headers,
        'Req' : req,
        'Res' : res
      }
    }

(抱歉,这是在 CoffeeScript 中而不是 JS 中)

在你的 Jade 模板中,你需要有类似的东西(在脚本中):

var myJson = !{JSON.stringify(debugJson)};

它将把 JSON 直接传递到脚本中。如果你希望它直接进入 DOM,比如:

#debug !{JSON.stringify(debugJson)}

这会将其转储到 div 中。

如果您只想在 Jade 模板中处理它,您可以简单地在 Jade 中使用循环。看这个previous StackOverflow question了解如何做到这一点。

关于javascript - 通过 AJAX 渲染 Jade 模板并尝试独立于 HTML 传递/访问数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10491024/

相关文章:

javascript - 测试服务时没有调用 NestJS UseFilter

javascript - 如果未选择单选按钮,则禁用 "Browse"按钮

html - div 大小覆盖窗口显示的 80%

javascript - 在递归函数中异步每个系列

html - Outlook 中的比例 html 图像

javascript - 自动调整固定图像的大小,以适应内容

node.js - FUNCTION_ERROR_INIT_FAILURE AWS lambda

javascript - Ember : Getting model data in the controller

javascript - 如何从 React.js 中的另一个文件实际启动一个函数

javascript - vue js动态重新排列组件的子组件