2017-03-27 14 views
1

MongoDBに既に格納されているデータを取得してHTMLでテーブルとして表示する方法を学習しようとしています。MongoDB/ExpressJSクエリを配列に格納してHTMLテーブルに表示する

<div> 
    <script> 
    var words = ["One", "Two", "Three", "Four", "Five", "Six", "Seven"]; 
    var numbers = [1,2,3,4,5,6,7]; 
    document.write('<table>'); 
     for (var i =0; i < words.length; i++){ 
     document.write('<tbody><tr><td>' + words[i] + '</td>' + '<td>' + numbers[i] + '</td></tr></tbody>'); 
     } 
    document.write('</table>'); 

    </script> 
</div> 

私が得た出力された:

One 1 
Two 2 
Three 3 
Four 4 
Five 5 
Six 6 
Seven 7 
私はずっとそう、私は私のHTMLコード内のスクリプトを作成することによって開始し、ループを使用して簡単なテーブルを表示することを決定したHTMLやJavaScriptで働いたことがありません

構文の仕組みを理解したので、NodeJS/ExpressJS/Mongooseのようなものを使ってMongoDBからドキュメントを取得し、配列に格納してテーブルとして表示したいと考えています。すでにデシベルtestとコレクションtest1内側に存在する

私のMongoDBのスキーマは次のとおりです。

{ 
    "_id": ObjectId("fffffffffffffff"), 
    "Words": "One", 
    "Numbers": 1 
} 
{ 
    "_id": ObjectId("aaaaaaaaaaaaaaa"), 
    "Words": "Two", 
    "Numbers": 2 
} 
... 

私は配列wordArraynumArrayに文書から「言葉」と「番号」の値を照会し、保存したいですそれらを表として表示します。

私は、これらの関連する質問が見つかりました:私は私が望むものをやって行くだろうどのように

Displaying MongoDB Documents with HTML

Display MongoDB values in HTML

How to use HTML in Express framework with nunjucks- no jade

?これらのリンクのどれを見てください。私はとても失われてどこから始めるべきか分からないからです。これを行う簡単な方法はありますか?私は次のようにしてみました:

<script> 
//import express package 
var express = require("express"); 

//import mongodb package 
var mongodb = require("mongodb"); 

//MongoDB connection URL - mongodb://host:port/dbName 
var dbHost = "mongodb://localhost:27017/test"; 

//DB Object 
var dbObject; 

//get instance of MongoClient to establish connection 
var MongoClient = mongodb.MongoClient; 

//Connecting to the Mongodb instance. 
//Make sure your mongodb daemon mongod is running on port 27017 on localhost 
MongoClient.connect(dbHost, function(err, db){ 
    if (err) throw err; 
    dbObject = db; 
}); 
//use the find() API and pass an empty query object to retrieve all records 
dbObject.collection("test1").find({}).toArray(function(err, docs){ 
    if (err) throw err; 
    var wordArray = []; 
    var numArray = []; 

    for (index in docs){ 
     var doc = docs[index]; 

     var words = doc['Words']; 

     var numbers = doc['Numbers']; 

     wordArray.push({"value": words}); 
     numArray.push({"value" : numbers}); 
    } 
} 
</script> 

私はこのような単純なことをしてから、wordArrayとnumArrayにアクセスできますか?

+0

とEJSへのリンクは、あなたがまだマングースを使用してデータを引っ張って試してみましたでしょうか? – Remario

+0

まだ、私はMongooseの使い方に関する良いチュートリアルを見つけることができませんでした – ss1111

+0

私は答えを知っていますが、あなたはmongooseまたはmongodbの知識が必要です – Remario

答えて

1

この例はMongoDBドライバに基づいていますが、あなたはmongooseやmonkなどのラッパーを使用してください。まず、データベースからデータを取り出し、配列に格納します。たとえば、保存後arr = ['dta','nio']このデータをビューまたはWebページにポイントするには、テンプレートバインディングエンジンが必要です.EJSはシンプルさと自然な感触のためEJSを使用します.EJSはデータとテンプレートを組み合わせてHTMLを生成します。 JavaScript変数をhtmlファイルにバインドします。ここにejsへのリンクがあります。 http://www.embeddedjs.com/

ここではマングースと述べることは素晴らしいリンクです。ここでhttps://scotch.io/tutorials/using-mongoosejs-in-node-js-and-mongodb-applications

は、ノードhttps://scotch.io/tutorials/use-ejs-to-template-your-node-application

+0

それは私が探していたものです。そのチュートリアルは素晴らしいようです!ありがとうございました。 – ss1111

関連する問題