剧场模式
首页后端Nodejs + Express + MongoDB 基础篇

Node.js + Express + MongoDB 基础篇 #14 项目实践 part 4 实现功能

下载源码hfpp2012发布于Nodejs2401 次点击播放时长:09:51
1

https://github.com/expressjs/body-parser

controllers/todoController.js

var bodyParser = require('body-parser');

var urlencodedParser = bodyParser.urlencoded({ extended: false });

var data = [ {item: 'get milk'}, {item: "walk dog"}, {item: 'kick some coding ass'} ];

module.exports = function(app) {
  app.get('/todo', function(req, res) {
    res.render('todo', { todos: data });
  });

  app.post('/todo', urlencodedParser, function(req, res) {
    data.push(req.body);
    res.json(data);
  });

  app.delete('/todo/:item', function(req, res) {
    data = data.filter(function(todo) {
      return todo.item.replace(/ /g, "-") !== req.params.item;
    });
    res.json(data);
  });
}

views/todo.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Todo list</title>
  <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
  <link rel="stylesheet" href="/assets/styles.css" type="text/css">
  <script src="/assets/todo-list.js"></script>
</head>
<body>
  <div id="todo-table">
    <form>
      <input type="text" name='item' placeholder="Add new item..." required />
      <button type="submit">Add Item</button>
    </form>
    <ul>
      <% todos.forEach(function(todo) { %>
        <li><%= todo.item %></li>
      <% }) %>
    </ul>
  </div>
</body>
</html>
5 条回复
  • Panda #1

    九分钟的时候,比较这里不是很明白

  • 17721229100 #2

    过滤器有一个问题,比如如果我输入了两个数字1,那么删除任意一个1都会删除两个1。

  • hfpp2012 #3

    因为有 g 参数,正则里的,这个你自己慢慢优化啦

  • RayAnti #4

    最后比较那一部分的意思是你点击的item和现有的item进行比较,如果不相等的话(return XXX!==XXX 是true)就return回来,继续在列表中显示;
    如果这个是false就说明点击的和现有的是相等的,就代表则是你要删除的item,就不return了,就是删除掉了

  • hfpp2012 #5
    RayAnti #10 回复

    是的

支付宝付款
微信扫码打赏

加我微信:15014006126

加 QQ 群:697272886(1 群)

加 QQ 群:856141852(2 群)

相似的视频

© Rails365 | 隐私条款 | 服务条款 | 粤ICP备15004902号 | 在线学员:9

Top