node.js 我应该在哪里定义要在 EJS 模板中调用的 JS 函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30535309/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Where should I define JS function to call in EJS template
提问by Newbie Programmer
I am working on a template where I am trying to render template using express and ejs. As to the standard structure of node app, I have app.js file which which contains functions like following:
我正在开发一个模板,我试图在其中使用 express 和 ejs 呈现模板。至于节点应用程序的标准结构,我有 app.js 文件,其中包含如下功能:
app.locals.getFlag = function(country) {
var flag_img_name = "";
if (country.toLowerCase() == "us") {
flag_img_name = "flag_us16x13.gif";
}
else if (country.toLowerCase() == "ca"){
flag_img_name = "flag_ca16x13.gif";
}
return flag_img_name;
}
I have some_template.ejs file which calls this function like follows:
我有 some_template.ejs 文件,它调用这个函数如下:
<img src="http://some_url_path/<%=getFlag(data_point[0].country_name) %>" width="16" height="14" alt="country" >
and it works just fine. However, I have around 15-20 functions like this and I don't want to define all of them in app.js. Is there any other place where I can define these functions and call them in the template same way as I am doing now? If yes, what would be the way to define them so that they are accessible like they are right now.
它工作得很好。但是,我有大约 15-20 个这样的函数,我不想在 app.js 中定义所有这些函数。有没有其他地方可以定义这些函数并以与我现在所做的相同的方式调用它们?如果是,那么定义它们的方法是什么,以便它们像现在一样可以访问。
I am new to node, express and ejs and not sure of different techniques. If someone could shed a light over it, it would be great. Thank you in advance.
我是 node、express 和 ejs 的新手,不确定不同的技术。如果有人能照亮它,那就太好了。先感谢您。
回答by Newbie Programmer
Just posting this answer here for someone who would might end up on this question while resolving same issue.
只是在此处发布此答案,供可能在解决同一问题时最终解决此问题的人使用。
All you have to do is create new file (say functions.ejs) and include it in the .ejs file where you want to call that function. So, I have function like this in file named functions.ejs:
您所要做的就是创建新文件(例如functions.ejs)并将其包含在要调用该函数的 .ejs 文件中。所以,我在名为的文件中有这样的功能functions.ejs:
<%
getPriceChgArrow = function(value) {
arrow_img_name = "";
if (value < 0) {
arrow_img_name = "arrow_down12x13.gif";
}
else {
arrow_img_name = "arrow_up12x13.gif";
}
return arrow_img_name;
}
%>
Then include functions.ejsinto the file you want to call function from. Say, I want to call this function in quote.ejsfile. So, I would include it as follows:
然后包含functions.ejs到要从中调用函数的文件中。说,我想在quote.ejs文件中调用这个函数。因此,我将其包括如下:
<% include *file_path*/functions %>
Just use this function at appropriate location in your ejs file from where you want to call it. For example:
只需在 ejs 文件中要调用它的适当位置使用此函数即可。例如:
<img src = "http:/some_url/<% getPriceChgArrow(data_point[0].value) %>" />
and you are all set. Hope this helps someone.
你都准备好了。希望这可以帮助某人。
回答by Siddhartha Chowdhury
Well, for some reason the accepted answer didn't worked out for me. Also it doesn't makes sense to create a separate *.ejsfile for each of my functions and then importing the file in view - specially when I have very simple logic to be implemented.
好吧,由于某种原因,接受的答案对我不起作用。此外,为我的每个函数创建一个单独的*.ejs文件然后在视图中导入文件也是没有意义的- 特别是当我要实现非常简单的逻辑时。
In fact it is very simple and easy to define function and use it in the view
事实上,定义函数并在视图中使用它是非常简单和容易的
I did this:
我这样做了:
<%
// ------ Define a function
get_tree = function(tree){
for(var i in tree){
%>
<%= tree[i].title %>
<%
}
}
// ----- Call the above declared function
get_tree(tree);
%>
And it works!
它有效!
Thanks
谢谢
回答by Faaiq
Create common functions in js file helper.js.
在 js 文件 helper.js 中创建常用函数。
function common1() {
//function body
}
function common2(key) {
//function body
}
module.exports = {
common1: common1,
common2: common2
}
And then require this file in your node function
然后在你的节点函数中需要这个文件
var helper = require('./helper');
and then pass this helper with ejs render
然后用 ejs 渲染传递这个助手
res.render('index', { helper:helper });
And use your function is ejs file
并使用你的函数是 ejs 文件
<%= helper.common1() %>
That's It
就是这样
回答by Rik
You can just require a separate file and set app.locals to this
您可以只需要一个单独的文件并将 app.locals 设置为此
app.locals = require('./path/helpers')
In helpers.js:
在 helpers.js 中:
getFlag = function(country) {
var flag_img_name = "";
if (country.toLowerCase() == "us") {
flag_img_name = "flag_us16x13.gif";
}
else if (country.toLowerCase() == "ca"){
flag_img_name = "flag_ca16x13.gif";
}
return flag_img_name;
}
anotherFunction=function(x){
return 'hello '+x
}
module.exports={getFlag, anotherFunction}
回答by Adam Murphy
It seems the easiest way to do this is to pass the function in attached to the object with all the data for the render:
似乎最简单的方法是将函数附加到带有渲染的所有数据的对象中:
in your js:
在你的js中:
const data = {
...all other data,
getFlags: function(country) {
var flag_img_name = "";
if (country.toLowerCase() == "us") {
flag_img_name = "flag_us16x13.gif";
} else if (country.toLowerCase() == "ca"){
flag_img_name = "flag_ca16x13.gif";
}
return flag_img_name;
}
};
ejs.render(template, data);
in your template:
在您的模板中:
<img src="http://some_url_path/<%=getFlag(data_point[0].country_name) %>" width="16" height="14" alt="country" >
回答by Rick
The order you setup your file has an importance on how the functions are defined. The execution is top to bottom not on document evaluation. Example below to setup your functions.
您设置文件的顺序对函数的定义方式很重要。执行是自上而下的,而不是文件评估。下面的示例设置您的功能。
document.html
文档.html
<section class="container">
<%- include('./helpers/common') %>
<%- include('./home') %>
</section>
common.ejs
常见的.ejs
<%
MyFunction = function() {
// Write your code here
}
%>
home.ejs
主页.ejs
<% if(MyFunction() ) { %>
<!-- Write your HTML markup -->
<% }%>
回答by Sod
In a js file, create a instance of the function like: if your function name is test (), Var ren = test ();will create a reference to this function.
在一个 js 文件中,创建一个函数的实例,如:如果你的函数名称是test (),Var ren = test ();将创建对这个函数的引用。
Before rendering data to the ejs page add the reference variable ren to that object:
在将数据渲染到 ejs 页面之前,将引用变量 ren 添加到该对象:
Data.ren = ren();
Res.render(Data)
And now in ejs while when you call <% ren() %>it will call the fonction.
现在在 ejs 中,当你调用<% ren() %>它时会调用函数。

