javascript - 使用express angularJs和mongoDB,但 Angular 中的ngResource未加载

标签 javascript node.js mongodb angularjs express

这是我的 MongoDB 后端代码

 var mongo = require("mongodb");
 var DbHost = "127.0.0.1";
 var DbPort = mongo.Connection.DEFAULT_PORT;


  module.exports.list = list;

  var db = new mongo.Db("ferrari-db",new mongo.Server(DbHost,DbPort,{}),{safe:true});
  var collectionName  = "carsList";


  function list(req,res,callback){

     db.open(function(error){
        db.collection(collectionName,function(error,collection){
           console.log("have the collection");
           collection.find().toArray(function(error,data){
               if (error) callback(false);
                else{
                   callback(true);
                   console.log(data);
                   res.json(data);

                  }
             });

          });
      });
   }

这是我的 Node.js 快速代码

   var express = require('express');
   var http = require('http');
   var path = require('path');
   var cars = require('./server/api/cars.js')

   var app = express();

   var client_dir =  path.join(__dirname, '/client')
   // all environments
   app.set('port', process.env.PORT || 3000);
   app.use(express.favicon());
   app.use(express.logger('dev'));
   app.use(express.bodyParser());
   app.use(app.router);
   app.use(express.static(client_dir));


   // development only
   if ('development' == app.get('env')) {
        app.use(express.errorHandler());
    }

   app.get('/', function(req,res){
       res.sendfile(path.join(client_dir,'index.html'))

    });

    app.get('/api/cars',cars.list);

    http.createServer(app).listen(app.get('port'), function(){
         console.log('Express server listening on port ' + app.get('port'));
    });

这是我的 angularJs app.js 代码

var CarApp = angular.module('CarApp',['ngResource'])

CarApp.config(function($routeProvider){
    $routeProvider
        .when('/',{controller:ListCtrl,templateUrl:'partials/list.html'})
         .otherwise({redirectTo:'/'})

 }) ;

 CarApp.factory('Cars',function($resource){
      return $resource('/api/cars/:id',{id:'@id'},{update:{method:'PUT'}})
 });

 function ListCtrl ($scope,Cars){

     $scope.cars = Cars.query();

 }

这是index.html文件

   <!DOCTYPE html>
  <html>
  <meta charset="utf-8">
  <title>Ferrari</title>


 <link type="text/css" rel= "stylesheet" href="vendor/bootstrap/css/bootstrap.css"/>
 <script src="vendor/bootstrap/js/bootstrap.js"></script>
 <script src="vendor/angular.min.js"></script>
 <script src="vendor/angular-resource.min.js"></script>
 <script src="js/app.js"></script>

 <body>
 <h1>Hello</h1>

      <div ng-app="CarApp" class="container">
           <div ng-view>
            </div>
      </div>
  </body>

  </html>

这是我的 list.html 文件

 <table class= "table table-bordered table-hover">
  <thead>
      <th>Type</th>
      <th>Mileage</th>
      <th>Year</th>
      <th>Price</th>
  </thead>

<tr ng-repeat="car in cars">
    <td>{{ car.title }}</td>
    <td>{{ car.mileage }}</td>
    <td>{{ car.year }}</td>
    <td>{{ car.price }}</td>
</tr>

</table>

list.html 模板正在加载。我收到错误无法加载资源:服务器响应状态为 500(内部服务器错误)?我还收到错误错误:发送后无法设置 header 。我可以在列表方法中注销控制台中的数据。任何帮助都会非常感激吗?

最佳答案

您的问题出在 cars.list 函数内。

Express 路由的结构如下function myRoute(req, res, next) {...}
next 函数(或您所说的 callback)只有在中间件之后有另一个函数时才有用。
也许之后会调用 errorHandler 中间件(app.get('/api/cars', cars.list);),我对此不确定。

问题可能是您调用 callback(true) 来启动下一个中间件(并发送带有 headers 等的响应),然后尝试使用 res.json(...) 发送另一个响应。
您需要删除callback(true)

所以我认为你应该这样重写你的函数:

function list(req, res, next) {

  db.open(function (error) {
    db.collection(collectionName, function (error, collection) {
      console.log('Have the collection');
      collection.find().toArray(function(error,data){
        if (error) {
          // Hopefully we pass the error to the error handler
          return next(error);
        } else {
          // If everything goes fine we send the data.
          console.log(data);
          return res.json(data);
        }
      });
    });
  });
}

关于javascript - 使用express angularJs和mongoDB,但 Angular 中的ngResource未加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18789795/

相关文章:

javascript - 使用 JS 从文本区域获取值并将其传递给服务器(jsp),无需重新加载页面

java - spring 中的 Node response.end() 等效项

node.js - Azure 部署失败 - 容器未响应端口 : 8080, 上的 HTTP ping,站点启动失败

javascript - .Net 使用 JavaScript 转换为 ISO 8601 日期格式

java - 如何为复合类实现 MongoDB 编解码器?

javascript - 如何更改消息框标题?

javascript - 未捕获的类型错误 : Cannot read property 'prototype' of undefined Meteor-File Package

javascript - 检测网页是否使用谷歌分析

spring - OpenApiGenerate后queryDsl的Spring Gradle任务失败

javascript - 输入类型范围输出不适用于动态 ID