使用 Node.js RESTful 路由，如何在编辑后更改其颜色？

Question

我对 RESTful 路由和 CRUD 有点陌生，所以我不确定如何去做，或者最好的方法是什么。我有一个 HTML 表，其中填充了来自称为环境的 MongoDB 集合的数据。该表是通过使用forEach 循环遍历集合来填充的。当一个条目被编辑时（1 个条目 = 表格的 1 行），我使用表单来使用 PUT 方法并以这种方式更新数据。

我希望能够通过在更新后将背景颜色更改为黄色来指示何时更新（有点像突出显示）。我在想我可以在每个表单输入旁边添加一个复选框或其他东西，用户在编辑某些内容时可以检查，然后表格单元格的背景颜色会根据是否选中该复选框而改变....但是我不知道如何使用这样的路线来做到这一点:(

我已经包含了我认为必要的内容，但如果您想查看更多代码，请告诉我：

app.js 路由：

var express = require("express"),
    app = express(),
    mongoose = require("mongoose"),
    bodyParser = require("body-parser"),
    methodOverride = require("method-override");

mongoose.connect("mongodb://localhost:27017/epims", {
 useNewUrlParser: true,
 useUnifiedTopology: true
});

app.use(methodOverride("_method"));
app.use(bodyParser.urlencoded({ extended: true }));
app.set("view engine", "ejs");
app.use(express.static(__dirname + "/public"));

//EDIT ENVIRONMENT ROUTE
  app.get("/environments/:id/edit", function(req, res){
      Environment.findById(req.params.id, function(err, foundEnvironment){
          if(err){
              res.redirect("/");
          } else {
              res.render("edit", {environment: foundEnvironment});
          }
      });
  });

//UPDATE ENVIRONMENT ROUTE
app.put("/environments/:id", function(req, res){
  Environment.findByIdAndUpdate(req.params.id, req.body.environment, function(err, updatedEnvironment){
    if (err) {
      res.redirect("/environments");
    } else {
      res.redirect("/environments/" + req.params.id);
    }
  });
});

html表格：

  <table class="environment">
    <tr>
      <th colspan=2>ePIMS</th>
      <th colspan=2>Region</th>
      <th colspan=2>HCHC</th>
      <th colspan=2>Membership</th>
    </tr>
    <% environments.forEach(function(environment){ %>
      <tr>
        <td class="td"><%= environment.ePIMS %></td>
        <td class="td"><%= environment.region %></td>
        <td class="td"><%= environment.HCHC %></td>
        <td class="td"><%= environment.membership %></td>
    <% }); %> 
      </tr>
  </table>

编辑表格：

    <form action="/environments/<%= environment._id %>?_method=PUT" method="POST">
        <input class="form-control" type="text" name="environment[ePIMS]" placeholder="ePIMS" value="<%= environment.ePIMS %>" />
        <input class="form-control" type="text" name="environment[region]" placeholder="Region" value="<%= environment.region %>" />
        <input class="form-control" type="text" name="environment[HCHC]" placeholder="HCHC Instance" value="<%= environment.HCHC %>" />
        <input class="form-control" type="text" name="environment[membership]" placeholder="Membership"  value="<%= environment.membership %>" />
        <button class="btn btn-primary">Submit</button>
    </form>

Answer 1

你可以在后端做这样的事情：

后端：

//I am using arrow function here to make the code looks cleaner
app.get('/environments/:id/edit', (req, res) => {

    //I am using promise here to make the code looks cleaner
    Environment.findById(req.params.id)

        .then(result => {

            res.render("edit", {
                environment: foundEnvironment,

                //Maybe the color can be here
                colorHere: 'yellow'
            });

            //The error will be caught here if any. No need of if(err) anymore
         })
        .catch(err => res.redirect("/"));

});

前端：

//I use handlebars most of the time. I am not 
//sure about the ejs syntax. But it should be
//something like this

<h1 style="color:<%=colorHere%>;">This is a Blue Heading</h1>