Question

我正在尝试根据博客的include使用来自ejs的name加载博客部分内容。

来自data.json的数据：

"blogs" : [{
    "title" : "Git Basics",
    "name" : "git_basics",
    "date" : "February 8, 2015",
    "category" : "git",
  },{
    "title" : "Javascript Basics",
    "name" : "javascript_basics",
    "date" : "December 31, 2014",
    "category" : "javascript"
  },{
    "title" : "Html5 Communication",
    "name" : "html5_communication",
    "date" : "November 25, 2014",
    "category" : "html5"
  }]

路线：

/* GET blog page. */
router.get('/blog', function(req, res) {
  var blogswithDetail = [];
  for(var i=0; i<appdata.blogs.length && i<4; i++){
    blogswithDetail.push(appdata.blogs[i]);
  }

  res.render('blog', { 
    title: 'Blog',
    blogswithdetail: blogswithDetail
  });
});

页：

<% blogswithdetail.forEach(function(item){ %>
    <article id="<%= item.name %>">
        <h2><%= item.title %></h2>
        <p><%= item.date %></p>
        <%= item.detail %>
    </article>
    <% include partials/content/blog_(item.name).ejs %>
<% }); %>

<% include partials/content/blog_(item.name).ejs %>这行代码不正确。 我的问题是如何将item.name插入include ，因此我可以根据item.name

的更改包含不同的部分内容

Answer 1

我认为你误解了ejs是如何工作的。 ejs接受提供的参数，并用参数替换标记：

的node.js：

res.render('test.ejs', {a: 'hello', b: 'world', c: 42});

test.ejs：

<%= a %><%= b %><br>
The answer to life, universe and everything else is <%= c %>

结果：

helloworld<br>
The answer to life, universe and everything else is 42

您可以传递对象：

res.render('test.ejs', {a: {a: 'a', b: 'b'}});

但是你不能使用对象的属性，只能使用整个对象。

在你的情况下，你应该这样做：

节点：

var item = {name: 'name', title: 'title', date: 'date', details: 'details'};
res.render('test.ejs', item);
//Or
//res.render('test.ejs', {name: item.name, title: item.title...

EJS：

<% blogswithdetail.forEach(function(item){ %>
    <article id="<%= name %>">
        <h2><%= title %></h2>
        <p><%= date %></p>
        <%= detail %>
    </article>
    <% include partials/content/blog_(<%= name %>).ejs %>
<% }); %>

或者：

<% blogswithdetail.forEach(function(){ %>
    var item = JSON.parse(<%= item %>);
    <article id="item.name">
        <h2>item.title</h2>
        <p>item.date</p>
        item.detail
    </article>
    <% include partials/content/blog_(item.name).ejs %>
<% }); %>

节点：

res.render('test.ejs', {item: JSON.stringify(item)});

Answer 2

我认为你在这里错过了诀窍。当我们开发任何Web应用程序时，我们应该尝试使其动态化。我们曾经拥有100个HTML并根据路线加载它们的日子已经一去不复返了，基本上称之为静态网络。

我从您的问题中了解到，您正在尝试根据参数值加载特定的EJS模板。想想一下情况，随着时间的推移，你的项目越来越大，所以你的参数值和每个特定的参数都会创建一个新的EJS模板，与其他模板差别不大。将有100个文件难以管理。

所以我建议你以正确的方式使用模板。只需包含一个EJS模板，其中使用表达式来区分b / w item.name并根据需要呈现视图。当然，你必须聪明地使用它，如果你认为有可能简化使用应该将模板分解为更小并重新使用现有模板。

示例：

<%if (item.name == 'xyz') { %>
// Do something 
<% } %>

在ejs上添加变量include

2 个答案: