EJS不在客户端渲染ejs代码

Question

I tried rendering EJS code that I sent from home.js to home.ejs as a string but it didn't work. I'm trying this now but nothing seems to work. My code is:

home.js

var templates = {};
templates.onScroll = fs.readFileSync('views/partials/onScrollAppendPost.ejs', 'utf-8');
res.render("users/home", {templates: templates});`

home.ejs

 var template = new EJS({text: <%- JSON.stringify(templates.onScroll) %>}).update('#mainContainer', {postArr: postArr});

Edit:

What im trying to do is I want to detect when a user gets to the bottom of the page. With this code:

$(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
//get post data and append post
}});

When the user gets to the bottom of the page i want to append ejs code to the page. Basically i want to communicate between ejs and js.

Answer 1

Based on the example at http://ejs.co , you first need to include a browser build of ejs in your page:

<script src="ejs.js"></script>

Then you can use EJS client-side like this:

var html = ejs.render('your template here', {postArr: postArr});

$('#mainContainer').html(html);

Here's I'm assuming postArr is set appropriately, possibly as the result of an AJAX request.

As you're using EJS to generate EJS it all gets a lot more difficult to understand but the relevant code in your home.ejs would be something like this:

var html = ejs.render(<%- JSON.stringify(templates.onScroll) %>, {postArr: postArr});

$('#mainContainer').html(html);

This assumes that the onScroll template doesn't include any other templates. You haven't specified whether home.ejs is being used to generate HTML or JavaScript so it's unclear precisely what other escaping considerations might apply but it's possible that won't be a problem.