如何在单击字体真棒图标时从 mongodb 中删除项目？答案

【问题标题】：How to delete item from mongodb on click of font awesome icon?如何在单击字体真棒图标时从 mongodb 中删除项目？
【发布时间】：2021-12-22 22:08:49
【问题描述】：

我正在开发库存应用程序，并尝试在单击 delete 字体真棒图标时从 mongodb 中删除项目。

我查看了 MDN 文档本地库项目 link，但他们使用带有隐藏表单输入的专用路由来删除项目。我似乎无法弄清楚如何对 pug 文件进行编码，以便在单击图标时在类别控制器中触发删除路由。

Category_detail.pug

extends layout 
block head 
    link(rel="stylesheet", href="/stylesheets/category_detail.css")
    <script src="https://kit.fontawesome.com/abb39a57a2.js" crossorigin="anonymous"></script>
block content 
    h1 #{category.name} 
    table
        thead 
            tr 
                th Item name 
                th Price 
                th Update 
                th Delete
        tbody 
            each item in items
                tr 
                    td #{item.itemName}
                    td #{item.price}
                    td
                        //- Update iten details 
                        a(href="#") 
                            i(class="fas fa-edit")
                    td 
                        //- Delete item 
                        form(method="POST" action='')
                            div.form-group
                                input(type="hidden", name='itemid',required="true", value=item._id )
                            a()
                                i(class="fas fa-trash" type='submit')
                            
                        //- a(href="#")
                            //- i(class="fas fa-trash")

如果您想查看任何其他文件，这是我的github

【问题讨论】：

标签： node.js express pug

【解决方案1】：

我不知道什么是哈巴狗，但我知道 HTML.. 我也是菜鸟。。首先，我们不能点击标签..所以，我们可以在锚标签上添加一个点击功能并编写我们的逻辑..（在你的情况下，它是一个删除逻辑）..

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。
这没有帮助

【解决方案2】：

我解决了。这是更新图标的代码

哈巴狗文件

td
  //- Update iten details 
      a( href=`/categories/${category._id}/update/${item._id}` class="updatebtn" data-updateid=`${item._id}`) 
        i(class="fas fa-edit")

我只是将href 添加到包含被点击项目的id 的锚标记中。之后在后端我使用req.param.id 来获取被点击的特定项目的ID。

itemController

exports.itemUpdate_get = (req, res)=>{
    Items.findById(req.params.id)
    .populate('category')
    .exec(function(err, data){
        res.render('item_form', {itemData: data});
    })
}

【讨论】：