Рули добавляют динамический контент - PullRequest
1 голос
/ 14 июня 2019

Как мне добавить данные в существующий список данных с помощью руля?

Я могу позвонить ?page=1, чтобы получить следующие 10 представленных предметов, но как я могу добавить их в уже существующий список?

У меня уже есть функция, где я могу вызвать некоторый JavaScript, когда пользователь прокручивает страницу до конца.

app.get("/", function (req, res) {
    let numRows;
    const numPerPage = parseInt(req.query.npp, 10) || 10;
    const page = parseInt(req.query.page, 10) || 0;
    let numPages;
    const skip = page * numPerPage;
    // Here we compute the LIMIT parameter for MySQL query
    const limit = skip + "," + numPerPage;
    queryAsync("SELECT count(*) as numRows FROM cars")
        .then(function (results) {
            numRows = results[0].numRows;
            numPages = Math.ceil(numRows / numPerPage);
        })
        .then(() => queryAsync("SELECT * FROM cars ORDER BY id ASC LIMIT " + limit))
        .then(function (results) {
            const responsePayload = {
                results: results
            };
            const data = { cars: results };
            const template = fs.readFileSync("./index.hbs", "utf8");
            const html = handlebars.compile(template)(data);
            if (page < numPages) {
                responsePayload.pagination = {
                    current: page,
                    perPage: numPerPage,
                    totalPages: numPages,
                    previous: page > 0 ? page - 1 : undefined,
                    next: page < numPages - 1 ? page + 1 : undefined
                }
            }
            else responsePayload.pagination = {
                err: "queried page " + page + " is >= to maximum page number " + numPages
            }
            //res.send(responsePayload);
            res.send(html);
        })
        .catch(function (err) {
            console.error(err);
            res.json({ err: err });
        });
});
<div id="cars-wrapper">
   <div class="row">
       {{#each cars}}
            <div class="col s12 m6 l4 xl3">
              <div class="car z-depth-1">
                <div class="car-header">
                  <div class="row no-margin">
                    <div class="col s12 m4 center-align">{{this.id}}</div>
                </div>
              </div>
            </div>
        {{/each}}
    </div>
</div>
...