programming html

Hướng dẫn how to fetch data from mongodb in html - cách tìm nạp dữ liệu từ mongodb trong html

Tôi đang gặp khó khăn khi tìm ra cách tôi có thể truy xuất dữ liệu trong MongoDB và tìm nạp nó trong tệp HTML/EJS. Trong tệp HTML/EJS, có một nút nếu người dùng nhấp vào nó, nó sẽ hiển thị tất cả dữ liệu trong bộ sưu tập cơ sở dữ liệu MongoDB.

Tôi đã tìm thấy một số câu hỏi tương tự như câu hỏi của tôi nhưng nó không trả lời câu hỏi của tôi. Tôi vẫn còn mới ở Node JS và MongoDB vì vậy tôi không thực sự có ý tưởng về cách tôi có thể đạt được mục tiêu của mình.

Đây là index.js của tôi

var express = require["express"];

var app = express[];
app.set['view engine', 'ejs']
//var hostname = '127.0.0.1';
var port = 3000;
var mongoose = require["mongoose"];
app.set['view engine','jade'];
mongoose.Promise = global.Promise;
mongoose.connect["mongodb://localhost:27017/commuters", {useNewUrlParser: true}];

app.use['/gui', express.static['gui']];
//use to link static file in the folder named public
var nameSchema = new mongoose.Schema[{
    route : String,
      origin : String,
      destination : String,
      estimatedTimeOfArrival : String,
      date : String,
      time : String
  },
  {
      collection : 'boardingAlight'
  }];
  //collection is the name of collection that you created in the same database name above
  var User = mongoose.model["User", nameSchema];

 var bodyParser = require['body-parser'];
app.use[bodyParser.json[]];
app.use[bodyParser.urlencoded[{ extended: true, useNewUrlParser : true }]];

app.use["/", [req, res] => {
    res.sendFile[__dirname + "/gui/index.html"];
  }];
//FOR PORT CONNECTION
//localhost:3000
app.listen[port, [] => {
  console.log["Server listening on port " + port];
}];

Khi tôi đã tạo tệp EJS bằng một nút, tôi cần hiển thị tất cả dữ liệu trong bảng. Cảm ơn bạn!

Tài liệu về nhà → node.js → Node.js

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

Bạn cũng có thể chỉ định thêm thông tin bạn đang yêu cầu bằng cách bao gồm các tham số bổ sung hoặc bằng cách chuỗi các phương thức khác như:

Sắp xếp kết quả
Bỏ qua kết quả trả về
Giới hạn số lượng kết quả trả lại
Chỉ định các trường nào để trả về

Bạn cũng có thể sử dụng một hoạt động tổng hợp để truy xuất dữ liệu. Loại hoạt động này cho phép bạn áp dụng một đường ống biến đổi theo thứ tự cho dữ liệu phù hợp.

Nếu bạn muốn theo dõi cơ sở dữ liệu cho dữ liệu đến phù hợp với một tập hợp các tiêu chí, bạn có thể sử dụng thao tác đồng hồ để được thông báo trong thời gian thực khi chèn dữ liệu khớp.

Ghi chú

Hoạt động truy vấn của bạn có thể trả về một tham chiếu đến một con trỏ chứa các tài liệu phù hợp. Để tìm hiểu cách kiểm tra dữ liệu được lưu trữ trong con trỏ, hãy xem trang Nguyên tắc cơ bản con trỏ.

Phương thức find[] được gọi trên đối tượng

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

2 tham chiếu bộ sưu tập bạn muốn truy vấn. Phương thức chấp nhận một tài liệu truy vấn mô tả các tài liệu bạn muốn truy xuất. Để biết thêm thông tin về cách chỉ định tài liệu truy vấn của bạn, hãy xem hướng dẫn của chúng tôi về cách chỉ định truy vấn.

Nếu bạn giải quyết

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

3 được trả về bởi find[], bạn sẽ nhận được tham chiếu đến

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

5 mà bạn có thể điều hướng các tài liệu phù hợp. Nếu bạn giải quyết

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

3 được trả về bởi

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

0, bạn sẽ nhận được tài liệu phù hợp hoặc

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

8 nếu không có trận đấu.

Thí dụ

Một nhà hàng pizza muốn tìm tất cả các pizza được đặt hàng bởi Lemony Snicket ngày hôm qua. Họ chạy truy vấn find[] sau trên bộ sưu tập

await cursor.forEach[console.dir];

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

Khi hoạt động trả về, biến

await cursor.forEach[console.dir];

1 tham chiếu đến

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

5. Bạn có thể in các tài liệu được truy xuất bằng phương pháp

await cursor.forEach[console.dir];

3 như được hiển thị bên dưới:

await cursor.forEach[console.dir];

Đầu ra có thể giống như sau:

[
  { name: "Lemony Snicket", type: "horseradish pizza", qty: 1, status: "delivered", date: ... },
  { name: "Lemony Snicket", type: "coal-fired oven pizza", qty: 3, status: "canceled", date: ...},
  ...
]

Xem Find [] và FindOne [] để biết các ví dụ có thể chạy hoàn toàn.

Nếu bạn muốn chạy một đường ống xử lý tùy chỉnh để truy xuất dữ liệu từ cơ sở dữ liệu của mình, bạn có thể sử dụng phương thức

await cursor.forEach[console.dir];

4. Phương pháp này chấp nhận các biểu thức tổng hợp để chạy theo trình tự. Các biểu thức này cho phép bạn lọc, nhóm và sắp xếp dữ liệu kết quả từ một bộ sưu tập.

Thí dụ

Một nhà hàng pizza muốn tìm tất cả các pizza được đặt hàng bởi Lemony Snicket ngày hôm qua. Họ chạy truy vấn find[] sau trên bộ sưu tập

await cursor.forEach[console.dir];

    const aggregateResult = await orders.aggregate[[
      {
        $match: {
          date: {
            $gte: new Date[new Date[].getTime[] - 1000 * 3600 * 24 * 7],
            $lt: new Date[],
          },
        },
      },
      {
        $group: {
          _id: "$status",
          count: {
            $sum: 1,
          },
        },
      },
    ]];

Khi hoạt động trả về, biến

await cursor.forEach[console.dir];

1 tham chiếu đến

    const findResult = await orders.find[{
      name: "Lemony Snicket",
      date: {
        $gte: new Date[new Date[].setHours[00, 00, 00]],
        $lt: new Date[new Date[].setHours[23, 59, 59]],
      },
    }];

5. Bạn có thể in các tài liệu được truy xuất bằng phương pháp

await cursor.forEach[console.dir];

3 như được hiển thị bên dưới:

await cursor.forEach[console.dir];

Đầu ra có thể giống như sau:

[
  { _id: 'delivering', count: 5 },
  { _id: 'delivered', count: 37 },
  { _id: 'created', count: 9 }
]

Xem Find [] và FindOne [] để biết các ví dụ có thể chạy hoàn toàn.aggregation for more information on how to construct an aggregation pipeline.

Nếu bạn muốn chạy một đường ống xử lý tùy chỉnh để truy xuất dữ liệu từ cơ sở dữ liệu của mình, bạn có thể sử dụng phương thức

await cursor.forEach[console.dir];

Thí dụ

Một nhà hàng pizza muốn nhận thông báo bất cứ khi nào đơn đặt hàng pizza mới xuất hiện. Để thực hiện điều này, họ tạo ra một đường ống tổng hợp để lọc các hoạt động chèn và trả lại các trường cụ thể. Họ chuyển đường ống này cho phương thức

[
  { name: "Lemony Snicket", type: "horseradish pizza", qty: 1, status: "delivered", date: ... },
  { name: "Lemony Snicket", type: "coal-fired oven pizza", qty: 3, status: "canceled", date: ...},
  ...
]

0 được gọi trên bộ sưu tập

await cursor.forEach[console.dir];

0 như hình dưới đây:

    const changeStream = orders.watch[[
      { $match: { operationType: "insert" } },
      {
        $project: {
          "fullDocument.name": 1,
          "fullDocument.address": 1,
        },
      },
    ]];
    changeStream.on["change", change => {
      const { name, address } = change.fullDocument;
      console.log[`New order for ${name} at ${address}.`];
    }];

Để biết ví dụ có thể chạy được của phương thức

[
  { name: "Lemony Snicket", type: "horseradish pizza", qty: 1, status: "delivered", date: ... },
  { name: "Lemony Snicket", type: "coal-fired oven pizza", qty: 3, status: "canceled", date: ...},
  ...
]

0 bằng trình điều khiển NodeJS, hãy xem ví dụ sử dụng luồng thay đổi.

Làm thế nào hiển thị dữ liệu MongoDB trong HTML?

Sau đó, bạn cần yêu cầu MongoDB trong trang của mình để tạo một ứng dụng khách MongoDB. Sau đó, bạn kết nối máy khách với cơ sở dữ liệu bằng cách chỉ định vị trí cơ sở dữ liệu trên tên của cơ sở dữ liệu. Sau đó, bạn có thể tìm thấy dữ liệu của mình và hiển thị nó đến trang HTML.connect the client to the database by specifying the database location on the name of the database. Then you can find your data and display it to the html page.

Làm thế nào tìm nạp dữ liệu từ MongoDB?

Bạn có thể sử dụng các hoạt động đọc để truy xuất dữ liệu từ cơ sở dữ liệu MongoDB của bạn.Có nhiều loại hoạt động đọc truy cập dữ liệu theo các cách khác nhau.Nếu bạn muốn yêu cầu kết quả dựa trên một tập hợp các tiêu chí từ bộ dữ liệu hiện có, bạn có thể sử dụng một thao tác tìm kiếm như các phương thức Find [] hoặc findOne [].use read operations to retrieve data from your MongoDB database. There are multiple types of read operations that access the data in different ways. If you want to request results based on a set of criteria from the existing set of data, you can use a find operation such as the find[] or findOne[] methods.

Làm thế nào để bạn truy xuất dữ liệu trong MongoDB bằng JavaScript?

Để chọn dữ liệu từ một bộ sưu tập trong MongoDB, chúng ta có thể sử dụng phương thức findOne [].Phương thức findOne [] trả về lần xuất hiện đầu tiên trong lựa chọn.Tham số đầu tiên của phương thức findOne [] là một đối tượng truy vấn.use the findOne[] method. The findOne[] method returns the first occurrence in the selection. The first parameter of the findOne[] method is a query object.

Làm thế nào tìm nạp dữ liệu từ MongoDB và hiển thị HTML bằng bình?

Đầu tiên, chúng tôi sẽ nhập các thư viện cần thiết vào ứng dụng của chúng tôi ...

Từ bình Nhập bình, Render_Template, Yêu cầu, Chuyển hướng, URL_FOR ..

từ BSON nhập objectid ..

từ nhập khẩu pymongo Mongoclient ..

Nhập hệ điều hành ..

Ghi chú

Thí dụ

Thí dụ

Thí dụ

Làm thế nào hiển thị dữ liệu MongoDB trong HTML?

Làm thế nào tìm nạp dữ liệu từ MongoDB?

Làm thế nào để bạn truy xuất dữ liệu trong MongoDB bằng JavaScript?

Làm thế nào tìm nạp dữ liệu từ MongoDB và hiển thị HTML bằng bình?

Bài Viết Liên Quan

Toplist mới

Bài mới nhất

Chủ Đề