Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/node.js/34.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 一旦我将数组作为对象传递给Node.js,我如何控制ejs文件中的数据_Javascript_Node.js_Express_Ejs - Fatal编程技术网

Javascript 一旦我将数组作为对象传递给Node.js,我如何控制ejs文件中的数据

Javascript 一旦我将数组作为对象传递给Node.js,我如何控制ejs文件中的数据,javascript,node.js,express,ejs,Javascript,Node.js,Express,Ejs,我正在使用Node.js和ejs创建一个基本的日历应用程序。我正在尝试通过express将一个月数组传递给我的ejs,我希望在按下“下一步”按钮时每个月都能完成。如何添加该功能 下面是Node.js中的代码 const Months = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]; 正如你所

我正在使用Node.js和ejs创建一个基本的日历应用程序。我正在尝试通过express将一个月数组传递给我的ejs,我希望在按下“下一步”按钮时每个月都能完成。如何添加该功能

下面是Node.js中的代码

const Months = [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
];
正如你所看到的,我作为一个物体在我的主要路线上度过了几个月

// main route
app.get("/", function(req, res){
res.render("main", {Months: Months});
});
这是我的ejs文件的一部分

<div class="container">
 <ul style="margin: 0; padding: 0; list-style-type: none">
<li class="prev" style="float: left; padding-top: 10px; color: white; font-size: 20px; text-transform: uppercase; letter-spacing: 3px;">

<!-- this is the previous button, when pressed should go back one month -->
<button class="btn btn-default" type="submit">Previous</button></li>

<li class="next" style="text-align: right; padding-top: 10px; color: white; font-size: 20px; text-transform: uppercase; letter-spacing: 3px;">

<!-- This is the next button, when pressed should go on the next month  -->
<button class="btn btn-default" type="submit">Next</button></li>

<li style="color: white; font-size: 20px; text-transform: uppercase; letter-spacing: 3px; text-align: center;">

  • 先前的
  • 下一个
这就是我传递月份对象的地方。我如何控制这里的数据,这样当我按下下一个或上一个按钮时,我可以循环浏览数据

<%= Months[0] %><br>
  <span style="font-size:18px">2016</span>
</li>
 </ul>

2016
该值仅在服务器端可用。如果你解码了这个值,你可以在客户端使用它

下面是一个简单的例子

<p id="month"></p>
<p>
<button id="prev">prev</button>
<button id="next">next</button>
</p>
<script>
let months = <%- JSON.stringify(Months) %>;

let index = 0;

let el = document.getElementById('month');

document.getElementById('prev').addEventListener('click', e => {
index--;

index = index < 0 ? 0 : index;

el.innerHTML = months[index];
});

document.getElementById('next').addEventListener('click', e => {
index++;

index = index >= months.length ? months.length - 1 : index;

el.innerHTML = months[index];
});
</script>

上 下一个

让月份=; 设指数=0; 设el=document.getElementById('month'); document.getElementById('prev')。addEventListener('click',e=>{ 索引--; 指数=指数<0?0:指数; el.innerHTML=月份[索引]; }); document.getElementById('next')。addEventListener('click',e=>{ 索引++; 指数=指数>=months.length?months.length-1:指数; el.innerHTML=月份[索引]; });
您是否试图在客户端Javascript中使用
months
数组?如果是这样,您需要在路径中的
标记中实际将该数组呈现为Javascript。不过,由于数组不是动态的,您可以直接将其写入页面中的脚本标记中。你不需要将永远不会改变的东西传递到渲染器中。好的,我会尝试这样做,谢谢@好的,我不知道我可以在ejs中使用jquery操作数据。非常感谢你。顺便说一下,如果我想让jquery成为一个外部文件,我必须把它放在公共文件夹中,或者放在什么地方,这样我的代码才是干净的。这与jquery无关。像这样小的东西可能会进入您的视图文件。您不应该为视图特定的代码段创建新文件。NodeJS是服务器端的,因此变量只在客户端呈现时出现,此后,如果不在客户端使用http请求,就无法访问任何服务器端变量。