Как изменить этот foreach, как для (я = 0; я - PullRequest
Новая
       3

Как изменить этот foreach, как для (я = 0; я

0 голосов
/ 17 июня 2019

Я новичок в использовании ejs, я хочу передать данные своей базы данных в мой файл ejs, но я хочу изменить синтаксис forEach, чтобы он был похож на (i = 0; i

Я нашел код для отображенияэто, но он приносит все мои данные базы данных, я просто хочу передать только 4 данных из моей базы данных

здесь мой код server.js 

    var hotelSchema = new mongoose.Schema({
        image: String
    });

    var Hotels = mongoose.model("Hotels", hotelSchema);

    //Hotel Page
    app.get("/hotel", function (req, res) {
        Hotels.find({}, function (err, hotel) {
            if (err) {
                console.log(err);
            } else {
                res.render("pages/hotel", { collection: hotel });
            }
        })
    })

здесь мой код ejs 

    <% collection.forEach(function(hotel) { %>
                <div class="col-md-3 col-sm-6">
                    <div class="img-thumbnail">
                        <img src="<%= hotel.image %>" style="width: 100%" alt="">
                        <div class="caption">
                            <h4>Image</h4>
                        </div>
                    </div>
                </div>
                <% }); %>

Я хочу изменить код foreach, потому что я хочу просто передать 4 данных из моей базы данных

Ответы [ 2 ]

0 голосов
/ 17 июня 2019

Если вы пытаетесь выполнить пагинацию, сделайте это следующим образом. Ваш Node.JS файл 

const ITEMS_PER_PAGE = 4;

exports.getIndex = (req, res, next) => {

    // start constants
    const page = +req.query.page || 1; // pagination
    let totalItems; // pagination
    // end constants

    Hotel.find()
    .countDocuments()
    .then(numberOfProducts => {
        totalItems = numberOfProducts;
        return Hotel.find()
                    .skip((page-1) * ITEMS_PER_PAGE)
                    .limit(ITEMS_PER_PAGE);
    }).then(hotels => {
        res.render('pages/hotel', {
            hotels: hotels,
            currentPage: page,
            hasNextPage: (ITEMS_PER_PAGE * page) < totalItems,
            hasPreviousPage: page > 1,
            nextPage: page + 1,
            previousPage: page - 1,
            lastPage: Math.ceil(totalItems / ITEMS_PER_PAGE)
        });
    }).catch(err => {
        console.log(err);
    });
}

А затем напишите ваши ejs следующим образом: 

<body>
    <div class="jumbotron">
        <div class="container">
            <h1 class="display-4">Hotels</h1>
        </div>
    </div>
    <div class="container">
        <%if (hotels.length > 0) {%>
        <div class="row">
            <%for (let hotel of hotels) {%>
            <div class="col-sm-4">
                <div class="card mt-4" style="width: 18rem;">
                    <div class="card-body">
                        <h5 class="card-title mt-2"><%=hotel.title%></h5>
                        <p class="card-text"><%=hotel.description%></p>
                    </div>
                </div>
            </div>
            <%}%>
            <div class="container mt-4">
                <nav aria-label="Page navigation example">
                    <ul class="pagination justify-content-center">
                        <% if (hasPreviousPage) { %>
                        <li class="page-item">
                            <a class="page-link" href="?page=1">First</a>
                        </li>
                        <li class="page-item">
                            <a class="page-link" href="?page=<%= previousPage %>"><%= previousPage %></a>
                        </li>
                        <% } %>
                        <li class="page-item active">
                            <a class="page-link" href="?page=<%= currentPage %>"><%= currentPage %></a>
                        </li>
                        <% if (hasNextPage) { %>
                        <li class="page-item">
                            <a class="page-link" href="?page=<%= nextPage %>"><%= nextPage %></a>
                        </li>
                        <li class="page-item">
                            <a class="page-link" href="?page=<%= lastPage %>">Last</a>
                        </li>
                        <% } %>
                    </ul>
                </nav>
            </div>
        </div>
        <%} else {%>
        <div class="text-center">
            <h5>No products found.</h5>
            <div class="mt-4">
                <a href="/" class="btn btn-outline-primary">Go Home</a>
            </div>
        </div>
        <%}%>
    </div>
</body>

Использовали загрузчик для CSS.

Вот как ты можешь это сделать. Он извлечет несколько элементов из базы данных и разбит на страницы пользовательский интерфейс.

0 голосов
/ 17 июня 2019

Вы должны иметь возможность использовать цикл для в EJS следующим образом: 

<% for(var i=0; i < 4; i++) { %>
  <div class="col-md-3 col-sm-6">
    <div class="img-thumbnail">
      <img src="<%= collection[i].image %>" style="width: 100%" alt="">
      <div class="caption">
        <h4>Image</h4>
      </div>
    </div>
  </div>
<% } %>

В качестве альтернативы, вы можете использовать опцию limit в своем запросе длявернуть только 4 результата: 

Hotels.find({}, { limit: 4 }, function (err, hotel) {
  if (err) {
    console.log(err);
  } else {
    res.render("pages/hotel", { collection: hotel });
  }
})
...