过滤器"/>
ejs 和 Javascript 中的过滤器
所以我一直在尝试制作一个过滤器，根据创建产品的用户过滤产品，有两种可能性角色“管理员”或角色“成员”。
这是控制器
exports.getProducts = async (req, res, next) => {
let filter = { userId: req.user._id }; // por defecto, solo mostrar productos del usuario autenticado
const products = await Product.find().populate('userId');
// si el usuario es admin, no aplicar filtro de usuario
if (req.user.role === 'admin') {
filter = {};
}
// Busca todos los usuarios
User.find({})
.then(users => {
// Busca los productos según el filtro aplicado
return Product.find(filter)
.then(products => {
res.render('admin/products', {
prods: products,
pageTitle: 'Admin Products',
path: '/admin/products',
users: users // Pasa los usuarios a la vista
});
});
})
.catch(err => {
const error = new Error(err);
error.httpStatusCode = 500;
return next(error);
});
};
这是视图.ejs
<%- include('../includes/head.ejs') %>
<link rel="stylesheet" href="/css/product.css">
<link rel="stylesheet" href="/css/forms.css">
</head>
<body>
<%- include('../includes/navigation.ejs') %>
<% if( role === "admin") { %>
<div class="dropdown">
<button class="btn">Created by</button>
<div class="dropdown-content">
<a href="#" id="me-link">Me</a>
<a href="#" id="others-link">Others</a>
</div>
</div>
<% } %>
<main class="<%= role %>">
<% if (prods.length > 0) { %>
<div class="grid">
<% let userIds = []; %>
<% for (let product of prods) { %>
<article class="card product-item <%= product.userId.role %>">
<header class="card__header">
<h1 class="product__title">
<%= product.title %>
</h1>
</header>
<div class="card__image">
<img src="/<%= product.imageUrl %>" alt="<%= product.title %>">
</div>
<div class="card__content">
<h2 class="product__price">
<%= product.price %> €
</h2>
<p class="product__description">
<%= product.description %>
</p>
</div>
<div class="card__actions">
<a href="/admin/edit-product/<%= product._id %>?edit=true" class="btn">Edit</a>
<input type="hidden" value="<%= product._id %>" name="productId">
<input type="hidden" value="<%= product.userId %>" name="userId">
<input type="hidden" name="_csrf" value="<%= csrfToken %>">
<button class="btn" type="button" onclick="deleteProduct(this)">Delete</button>
</div>
</article>
<% userIds.push(product.userId); } %>
</div>
<% let userRolesIds = []; %>
<% for (let user of users) { %>
userRolesIds.push({ role: '<%= user.role %>', id: '<%= user._id %>' });
<% } %>
<% } else { %>
<h1>No Products Found!</h1>
<% } %>
</main>
<%- include('../includes/end.ejs') %>
<script src="/js/admin.js"></script>
<script>
const meLink = document.querySelector('#me-link');
const othersLink = document.querySelector('#others-link');
const main = document.querySelector('main');
let role = '';
meLink.addEventListener('click', (event) => {
event.preventDefault();
role = 'admin';
main.classList.remove('member');
main.classList.add('admin');
});
othersLink.addEventListener('click', (event) => {
event.preventDefault();
role = 'member';
main.classList.remove('admin');
main.classList.add('member');
});
</script>
</body>
最大的问题是，由于明显的原因，产品和用户在不同的集合中，因此在创建产品的 userId 中它们之间的引用。
我希望当我点击“我”按钮时隐藏角色“成员”制作的产品，当我点击“其他”按钮时反之亦然。
回答如下：更多推荐
ejs 和 Javascript 中的过滤器
发布评论