mongodb数据库的表格和表示

我想以html的forms在node.js，express.js和angular.js中以表格forms显示mongodb数据。

我现在正在做的是这样的

route.js

app.get('/superhero', function(req, res) { superhero.superhero_list(req,res); res.sendfile('./public/superhero.html'); }); 

superhero.js

 var express = require ('express') var rootRequire = require('root-require'); var bodyParser = require('body-parser'); var superheroSchema = rootRequire('Anguar/models/superhero'); module.exports = { superhero_list: function(req, res) { superheroSchema.find({}, function(err, superhero) { if (err) { return res.status(400).send({ "message": "Server error!", "err": err }); } else { return res.status(200).send({ "superheros": superhero }); } } }; 

superhero.html

 <h1> Super heros</h1> <table> <thead> <tr> <th>S.no</th> <th>Super hero</th> <th>Status</th> <th>Action</th> </tr> </thead> <tbody> <tr> // to implement the table </tr> </table> 

我面临的问题是对这个问题的回应

 return res.status(200).send({ "superheros": superhero }); 

直接给我回应

{ “超级英雄”：[{ “_ ID”： “582c5211c8a8e06c0849a238”， “名”： “超人”}，{ “_ ID”： “583bf729a9de83840ca277dc”， “名”： “蜘蛛侠”}，{ “_ ID”： “583bf78ca9de83840ca277de” ， “姓名”： “蝙蝠侠”}，{ “_ ID”： “583bf793a9de83840ca277df”， “名称”： “Shaktiman”}，{ “_ ID”： “583bfc97a9de83840ca277e0”， “名称”： “我”}]}

而不是加载superhero.html

如何获取数据到HTML？

Answer 1

看起来你正在试图渲染这个服务器端。 现在在客户端渲染它可能会更容易一些。 一旦这个工作，你可以评估是否服务器端渲染将有利于你。

您没有提供代码的Angular部分，但是您可以轻松地将Angular中的某些东西插入到API中，然后像下面这样加载结果：

服务

 angular.module('app') .service('myService', function($http) { this.getSuperheroes = function() { return $http.get('<path_to_api>/superhero'); } }); 

调节器

 angular.module('app') .controller('myController', function($scope, myService) { myService.getSuperheroes() .then(function(superheroes) { $scope.superheroes = superheroes; }); }); 

模板

 <table> <thead> <tr> <th>S.no</th> <th>Super hero</th> <th>Status</th> <th>Action</th> </tr> </thead> <tbody> <tr ng-repeat="superhero in superheroes"> <td>{{superhero.number}}</td> <td>{{superhero.name}}</td> <td>{{superhero.status}}</td> <td>{{superhero.action}}</td> </tr> </table> 

正如你所看到的，该服务提供了一个function来检索你的超级英雄，然后你可以从你的控制器调用该服务function，然后在你的表中显示结果。

您也可能想要将您的route.js更改为以下内容：

 app.get('/superhero', function(req, res) { return superhero.superhero_list(req,res); }); 

这样它将返回数据库调用的响应，而不是发送一个静态文件。 请记住，在Angular应用程序的某个地方，您将不得不渲染模板（您可以在Angular网站上findhello world示例），因为您不是将其渲染到服务器端。

希望有所帮助！ 高兴回答关于这个:)的任何进一步的疑问