如何使用JavaScript动态更改jade变量?

如何使用JavaScript动态更改jade变量?,javascript,node.js,pug,Javascript,Node.js,Pug,例如,在我的文件index.jade中,我有: 扩展布局 块变容镜 -所选变量='Home'; -var isEmpty='false'; 身体 按钮单击“更改状态”按钮 剧本 功能变化状态{ //将此处的isEmpty变量更改为true-如何? } 不,你在这里要求做的是不可能的。Pug在服务器上运行,JavaScript在浏览器的客户端上运行。一旦在服务器上呈现了哈巴狗模板(即哈巴狗模板),过程中就没有哈巴狗了 您可以使用pug预加载变量名: script. var isEmpty =

例如,在我的文件index.jade中,我有:

扩展布局 块变容镜 -所选变量='Home'; -var isEmpty='false'; 身体 按钮单击“更改状态”按钮 剧本 功能变化状态{ //将此处的isEmpty变量更改为true-如何?
} 不,你在这里要求做的是不可能的。Pug在服务器上运行,JavaScript在浏览器的客户端上运行。一旦在服务器上呈现了哈巴狗模板(即哈巴狗模板),过程中就没有哈巴狗了

您可以使用pug预加载变量名:

script.
  var isEmpty = !{isEmpty};
  function changeState(){
    // change isEmpty variable here to true -- how to ?
  }
或者,如果您有一个更复杂的对象,可以在将其传递给模板之前对其进行字符串化:

script.
  var user = !{user};
  function changeUserName(){
    user.name = ...
  }

不,你在这里要求做的是不可能的。Pug在服务器上运行,JavaScript在浏览器的客户端上运行。一旦在服务器上呈现了哈巴狗模板(即哈巴狗模板),过程中就没有哈巴狗了

您可以使用pug预加载变量名:

script.
  var isEmpty = !{isEmpty};
  function changeState(){
    // change isEmpty variable here to true -- how to ?
  }
或者,如果您有一个更复杂的对象,可以在将其传递给模板之前对其进行字符串化:

script.
  var user = !{user};
  function changeUserName(){
    user.name = ...
  }

我们直接知道这是不可能的,但我找到了一种用JS实现的方法。我知道这可能不是正式的、正确的行为,类似的事情可以用例如来完成,但是对于那些需要快速测试并且需要通过阅读新的软件模块文档来节省时间的人,可以这样做:

正如我在一篇评论中提到的,可以使用URL进行访问。在我的服务器文件app.js中,我需要配置我的路由,该路由将发送到我的同一个视图,以获得通过URL从视图页面的javascript获取的pug/jade我的变量:

app.get('/home/user/:id', function(req, res) {

  var id = req.params.id;

  // do the DB or other stuff here

  console.log('I received in the server user id from JS(FB GraphAPI): '+ id);

  app.locals.isEmpty= id

  res.redirect('/home');

});

app.get('/home', function(req, res) {

  res.render('home', { isEmpty: app.locals.id }); // or if you want send anything

});
我的家里有这个。jade文件:

现在在我的home.jade中,我有来自JS的变量:

-var isEmpty=34sfd

这样做的代价是最终会出现手动页面刷新

对于那些希望将此变量发送到扩展名jade/pug file layout.jade的用户,您甚至不必将其作为对象发送,您现在可以轻松地从一组局部变量中选择它:

-var isEmpty= locals.isEmpty

我们直接知道这是不可能的,但我找到了一种用JS实现的方法。我知道这可能不是正式的、正确的行为,类似的事情可以用例如来完成,但是对于那些需要快速测试并且需要通过阅读新的软件模块文档来节省时间的人,可以这样做:

正如我在一篇评论中提到的,可以使用URL进行访问。在我的服务器文件app.js中,我需要配置我的路由,该路由将发送到我的同一个视图,以获得通过URL从视图页面的javascript获取的pug/jade我的变量:

app.get('/home/user/:id', function(req, res) {

  var id = req.params.id;

  // do the DB or other stuff here

  console.log('I received in the server user id from JS(FB GraphAPI): '+ id);

  app.locals.isEmpty= id

  res.redirect('/home');

});

app.get('/home', function(req, res) {

  res.render('home', { isEmpty: app.locals.id }); // or if you want send anything

});
我的家里有这个。jade文件:

现在在我的home.jade中,我有来自JS的变量:

-var isEmpty=34sfd

这样做的代价是最终会出现手动页面刷新

对于那些希望将此变量发送到扩展名jade/pug file layout.jade的用户,您甚至不必将其作为对象发送,您现在可以轻松地从一组局部变量中选择它:

-var isEmpty= locals.isEmpty

是的,这就是我现在所知道的。。好吧,那是不可能的。。。我甚至尝试了localStorage,或者pug预加载函数。。。但是正如你所说的,客户端和服务器的距离太远了。。。难道没有一种方法可以通过路由来实现吗?例如,客户端JS将通过URL向route发送参数,route将在下一次加载该页面后设置该pug变量。。。我正在尝试使用GraphAPI进行FB登录,我已成功获得会话令牌,但不知道如何更改我的帕格菜单项,帕格将如何知道。。。我尝试了很多教程,现在工作了12个小时,但都没有成功…我想你正在尝试在了解基本知识之前进行高级web开发。。好吧,那是不可能的。。。我甚至尝试了localStorage,或者pug预加载函数。。。但是正如你所说的,客户端和服务器的距离太远了。。。难道没有一种方法可以通过路由来实现吗?例如,客户端JS将通过URL向route发送参数,route将在下一次加载该页面后设置该pug变量。。。我正在尝试使用GraphAPI进行FB登录,我已成功获得会话令牌,但不知道如何更改我的帕格菜单项,帕格将如何知道。。。我尝试了很多教程,现在工作了12个小时,但都没有成功……我认为你正在尝试在理解基础知识之前进行高级web开发。