表示.js部分呈现数据 EJS

Express.js to EJS rendering data partially

本文关键字:数据 EJS js 表示      更新时间:2023-09-26

想象一下数据库,如下所示。

// 'Article'  Schema
{ 
subject : 'Hello world', 
content : 'I want to display this content partially. 
           The content would has verbose text like long
           blabla...........blabla.......blabla......blabla...........
           blabla.......blabla......blabla...........b........
           and even more, It would has <img src=".......jpg"/>
}

现在我把这个数据渲染到一些 ejs 文件,

<table>
<% Articles.forEach(function(article, index){ %>
    <tr>
       <td> <%= article.subject %> </td>
       <td> <%= article.content %> </td>
    </tr>
<% }) %>
</table>

// To don't display verbosely, give style attribute (Of course, on top of html)
<style>
     td { white-space: nowrap; overflow: hidden; }
</style>

但这样,它可能会降低应用程序性能,对吧?如果一页上有 10、20、30 篇文章,服务器将尝试显示所有这些内容。我想做的是一些内容的总结,我怎样才能巧妙地做到这一点?

对于夏季内容,在末尾显示带有省略号的初始几个文本

<table>
<% Articles.forEach(function(article, index){ %>
    <tr>
       <td> <%= article.subject %> </td>
       <td> <%= article.content.substring(0,10) %> ...</td>
       <td> <a id="read_more" content_id="cont-id" href = "javascript:(void)"> read more..</a></td>
    </tr>
<% }) %>

然后使用ajax应用程序在单击read more时获取完整的数据,具体取决于您使用的是jquery还是angular等。

如果有更多的文章,那么pagination ajax application or page refresh

在节点端创建 API,以与页面加载期间相同的格式提供此内容数据或新文章