簡體   English   中英

嵌入式JS(ejs)不會將數據呈現給瀏覽器

[英]Embedded JS (ejs) isn't rendering data to browser

我正在使用express, node, pg-promise, and ejs.開發一個簡單的To Do應用程序express, node, pg-promise, and ejs. 我創建了一個數據庫,但無法使內容顯示在瀏覽器中。

奇怪的是,當我檢查瀏覽器時,它可以識別每個任務的形狀,但是除了<p>標記之外,它們都是空的。 <h1>標簽和內容顯示出來,所以我認為這是一個比目魚/烏賊的問題,但我不太確定。

出現了json數據,但是切換到response.render並鏈接index.ejs文件后,我沒有任何運氣。

這是文件結構的基本概述:

1. models
   - task.js
2. views
   - edit.ejs
   - index.ejs
   - new.ejs
   - show.ejs
3. server.ejs, package.json, form.html

數據庫名稱:todo_app

表名稱:任務

id | subject  |             content
----+----------+---------------------------------
  1 | planning | plot world domination
  2 | garden   | find victims for venus fly trap
  3 | food     | buy pickles
  4 | postman  | test post

注意:我與郵遞員一起添加的4號。


index.ejs

<body>
  <h1>Here's the task list:</h1>
  <% tasks.forEach((everyTask) => {%>
    <p>
      <%= tasks.content %>
    </p>
    <%})%>
</body>

</html>

server.js

const express = require('express');
const app = express();
const PORT = 3000;
const bodyParser = require('body-parser');
// const models = require('./models/task')

app.use(bodyParser.json())

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

app.set("view engine", "ejs");

const findAllTasks = require('./models/task').findAllTasks;
const findById = require('./models/task').findById;
const createTask = require('./models/task').createTask;
// const edit = require('./models/task').edit;
// const delete = require('./models/task').delete;


app.get('/', (request, response) => {
  findAllTasks().then(everyTask => {
    response.render('index', { tasks: everyTask });
  });
});


app.listen(PORT, () => {
  console.log(`Welcome to the Year ${PORT}, the world of tomorrow!`)
});

task.js

const pgp = require('pg-promise')({});

const connectionURL = "postgres://localhost:5432/todo_app";

const db = pgp(connectionURL);

const findAllTasks = () => {
  return db.any('SELECT * FROM tasks');
}

const findById = id => {
  return db.one('SELECT * FROM tasks WHERE id = $1', [id]);
};

const createTask = data => {
  return db.one('INSERT INTO tasks(subject, content) VALUES($[subject], $[content]) RETURNING id', data)
}

module.exports = {
  findAllTasks: findAllTasks,
  findById: findById,
  createTask: createTask
  // edit: edit,
  // delete: delete
};

我認為使用task.ejs意味着: index.ejs 並且您的forEach應該如下所示:

<body>
  <h1>Here's the task list:</h1>
  <% tasks.forEach((everyTask) => {%>
    <p>
      <%= everyTask.content %>
    </p>
    <%})%>
</body>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM